FujoCoded LLC – A better web, together
LightNews LightNews
banner
fujocoded.bsky.social
FujoCoded LLC – A better web, together
@fujocoded.bsky.social
610 followers 2 following 420 posts
Empowering fujin and other online subcultures to shape their web through software, education, and community collaboration.

Support us @
📈Patreon: https://www.patreon.com/fujocoded
🛍️Store: https://store.fujocoded.com/
Posts Replies Media Videos
fujocoded.bsky.social
Wallpapers and Website Freebies feature exclusive artwork we commissioned from amazing fandom artists—make the fandom economy go round for JUST $9.99!!

And if you're joining us now, check out the TOC of our HTML/CSS/JS learn-along, the shining 🌟 of this pack 👇

store.fujocoded.com/products/oth...
First image: Screencap of a preview for the Fortune Cookies site. Boba-tan, the FujoCoded mascot, is in a white and red robe with a light golden fortune cookie as a moustache. Boba-tan is standing against a tan background with red borders. Under Boba-tan is a white box with red border, and black text that reads “seek a fortune if you dare”. Under that is a clickable menu, asking for the user to select a vanilla, chocolate, or lemon fortune cookie, and a button saying “get a fortune”. Vanilla is selected. - 01. Clean up the styling slate with a CSS reset - 02. Wait to run JavaScript until the page is ready - 03. Tell screen reader users about content updates - 04. Get the browser's help with single-choice options - 05. Pre-select your options - 06. Create comfortable—and accessible!—inputs with labels PART 1: Declaring our fortunes - 01. Using arrays to store our fortunes - 02. Naming conventions - 02.a Naming conventions – Screaming Snake Case - 02.b Naming conventions – Camel Case - 02.c Naming conventions – Why we use them PART 2: Declaring our functions - 03. Using functions to organize our code - 04. Getting the list of fortunes for a given flavor - 05. Handling errors - 06. Getting a random number between two values PART 3: Adding interactivity to the page - 07. Selecting page elements with document.querySelector - 08. Reacting to events with event listeners - 09. Finding the chosen flavor - 10. Searching through an array - 11. Modifying the page content with innerHTML PART 1: Declaring our fortunes - 01. Using arrays to store our fortunes - 02. Naming conventions - 02.a Naming conventions – Screaming Snake Case - 02.b Naming conventions – Camel Case - 02.c Naming conventions – Why we use them PART 2: Declaring our functions - 03. Using functions to organize our code - 04. Getting the list of fortunes for a given flavor - 05. Handling errors - 06. Getting a random number between two values PART 3: Adding interactivity to the page - 07. Selecting page elements with document.querySelector - 08. Reacting to events with event listeners - 09. Finding the chosen flavor - 10. Searching through an array - 11. Modifying the page content with innerHTML PART 1: Single-column Layouts - 01. Laying down our Cascade: setting and overriding defaults - 01.a Styling the <body> with a tag-based selector - 01.b Default values and the cascade - 01.c Setting a fallback font family for our page - 01.d Setting a responsive font size for our page - 02. Keeping your CSS values consistent with custom properties - 03. Single-column layouts pt.1: a responsive, centered column - 03.a Making your column's width shrink and grow with the window - 03.b Horizontally centering your column - 03.c Stretching a column to the full height of the page - 04. Single-column layouts pt.2: arranging and aligning content - 04.a Making your elements "flex" into a vertical column - 04.b Adding space between your elements (but not around them) - 04.c Centering the content inside the column * PART 2: Text, Borders, and Layered Images - 05. Styling the container for our fortunes - 05.a Centering a single element... - 05.b ...and the text inside it! - 05.c Setting a width based on text content - 06. Overlapping an image with its surrounding content... - 06.a ...and layering it on top of its siblings! - 07. Muted text color with opacity - 08. Balancing multi-line text with text-wrap: balance - 08.a ...while checking browser support for this newer feature
November 20, 2025 at 9:53 PM
fujocoded.bsky.social
Soft launch phase is now over! 🥳

With the HTML/CSS/JavaScript learn-along out for feedback, we'll focus on wrapping up the rest of our digital pack: wallpapers, website goodies, and an exclusive FREE SHIPPING* code for the rest of our store!

Only $9.99!! 😘

store.fujocoded.com/products/oth...
original_1763674701015_ckaj9x4oy
November 20, 2025 at 9:53 PM
fujocoded.bsky.social
Please also witness our learning guide 🪴🎓 if you thought "wow, they sure seem to be putting A LOT OF TIME into this pack", this 👇 is (also) why—it shows how much we care!

As said before, we know learning to code can be scary; we believe it doesn't have to be!

store.fujocoded.com/products/oth... 👈🛍️
Not sure where to start? While there's as many learning paths as there are readers, here's some advice to help you find your way to learn! In this file... About this Learn-along General Tips When in Doubt, Ask for Help 🫴💖 Finding your Learning Path 1. I want to fully understand the ins and outs! Our advice 2. I want to build something similar Our advice 3. I want to level up my CSS or JS skills Our advice 4. I want to learn specific techniques Our advice 5. Actually, I'm not sure what I want... Our advice Still stuck? Final Thoughts About this Learn-along This learn-along is made up of three heavily commented files that work together to create an interactive webpage. On this page, which features a responsive single-column layout, the user can click a button to get a randomly chosen fortune among 3 different sets. The main files are: learn-along.html — The structure learn-along.css — The styling learn-along.js — The interactivity The code you'll find inside is complete and fully working. You can learn by following along the comments to explore, experiment, and understand how everything connects. If you wish, you can jump around between sections and files, and tackle them in the order you prefer. Each file also contains multiple [[EXTRA CREDIT]] callouts, which are optional hands-on exercises or starting points for deeper exploration. In addition to using them to learn along, the files are structured to serve as a reference for building or styling your own sites. The table of contents at the top of each file is provided to quickly help you find the right section for what you seek to accomplish. Finding your Learning Path Prophet Boba-tan may know your fannish future, but this learning journey is yours to walk. So, what brings you here? I want to fully understand the ins and outs! I want to build something similar I want to level up my CSS or JS skills I want to learn specific techniques Actually, I'm not sure what I want... 1. I want to fully understand the ins and outs! If you're a linear learner who likes to dive deep and build their knowledge comment by comment, we recommend you follow the basic path: Start from HTML to understand how the page is structured Move on to CSS and see how the page is styled Dive into the JavaScript section and learn what happens when the button is clicked Since the CSS and JavaScript learning paths are independent, you can also choose to tackle them in a different order or jump across as your fancy strikes. For example, you might look at how to build a responsive single-column layout, experiment with JavaScript, then move back to finish the other CSS sections! Our advice Read each section thoroughly, fiddle with the code, and see how the page changes. Take breaks between sections and experiment with your own pages. Tackle those [[EXTRA CREDITS]] that jump out to you as you learn, but feel free to leave some to do later at your leisure. 2. I want to build something similar If you're looking to get your hands dirty (either by building your own generator site or your own CSS layouts), we recommend you: Get the lay of the land by skimming all 3 files and finding the sections related to your project Play around with the existing code in the relevant sections to understand how it works and what to "lift" Build your own site from scratch, using this learn-along as a reference Our advice
November 19, 2025 at 9:32 PM
fujocoded.bsky.social
IT'S OFFICIAL! As of a couple hours ago, our digital pack preview is in the inboxes of April buyers 🎉

If you're among them, we'd love and cherish your feedback 🙏💖 What was good? What was less so? Help us make it 👇 the BEST RESOURCE 🆒🎓

Only $5 until tomorrow!!

store.fujocoded.com/products/oth...
Fandom Fortune Generator — Prophet Boba-tan's Learn-along Note: For the best reading experience, use a markdown viewer or open README.html (inside _README_html/) in your browser. If reading this file in a plain text editor, you may see some unusual characters—this is normal for markdown files! Thank you for purchasing the Fandom Cookies Digital Pack! This folder contains an exclusive reward: a "random generator" website inspired by our April 1st 2025 "Fandom Cookies" event, featuring heavily commented code that will teach you many useful not-so-basics of HTML, CSS, and JavaScript! A screenshot of prophet boba-tan, inviting you to seek a fortune In this file... What you'll learn What you'll find In this folder In the code/ folder What you'll need Getting started Quick learning tips [⚠️ CONTENT WARNINGS ⚠️] Learn more with us... ...and connect! Brought to you by... Learn-along Art Extra What you'll learn In this learn-along, you'll explore all the nitty-gritty details of how we built this website, from creating single-column layouts using modern CSS to making pages that respond to user input, both with visual effects and interactive functionality. By the end, you won't just have a solid foundation of professional, modern web development knowledge, but a practical reference to return to whenever you need help building the website(s) of your dreams. What you'll find In this folder This folder includes a few (optional) files to help you through your learning journey: README.md — this file, with high level guidance LEARNING_GUIDE.md — in-depth guidance and suggestions on how to approach this tutorial CONTENT_WARNINGS.md — in-depth guidance on content warnings for each cookie flavor If you wish to read these files with proper formatting directly in your browser, you'll find a .html version of each inside the _README_html/ folder. In the code/ folder Inside the code/ folder, you'll find the main content of our learn-along: learn-along.html — sets up the HTML structure learn-along.css — styles the page with CSS learn-along.js — selects and displays a random fortune with JavaScript reset.css — A CSS reset for consistent styling across browsers images/ — Our adorable Prophet Boba-tan art ...and some extra files to aid you in your learning mission journey: _with_short_comments/: this folder contains a version of the HTML/CSS/JS files with shortened comments, which only include the table of contents and the more technical explanations. Check it out for a "bird's-eye view"! _with_syntax_highlight/: this folder contains one HTML page for each file in the learn-along, and renders its code with proper syntax highlighting. If you don't have a code editor with this feature, it's a great tool to make the code easier to read—especially on the go!
November 19, 2025 at 9:19 PM
fujocoded.bsky.social
Ok not out YET, but... the email is written and scheduled for tomorrow morning🎉🎊 (proof👇)

Apologies for the slight bait&switch 🙏🙇, as you know technology can be...complicated. And so is distributing digital packs previews, apparently.

Still time to snatch it 👀👇🛍️
store.fujocoded.com/products/oth...
An email for the digital email campaign preview
November 19, 2025 at 7:47 AM
fujocoded.bsky.social
Just when you think you're done shipping, there's always ONE more thing that absolutely must get done

(applies to both fictional characters and digital packs)
November 19, 2025 at 1:24 AM
fujocoded.bsky.social
We've sung our pack's praises for weeks, and can't wait to see you all sing them instead—like those who already read it 👀

Inside you'll find:

- A full on HTML/CSS/JS course
- Wallpapers & website goodies
- ...free shipping coupon!

All for just $5 (for now) 👇

store.fujocoded.com/products/oth...
original_1763505820002_0361wmbi6 - 01. Clean up the styling slate with a CSS reset - 02. Wait to run JavaScript until the page is ready - 03. Tell screen reader users about content updates - 04. Get the browser's help with single-choice options - 05. Pre-select your options - 06. Create comfortable—and accessible!—inputs with labels PART 1: Declaring our fortunes - 01. Using arrays to store our fortunes - 02. Naming conventions - 02.a Naming conventions – Screaming Snake Case - 02.b Naming conventions – Camel Case - 02.c Naming conventions – Why we use them PART 2: Declaring our functions - 03. Using functions to organize our code - 04. Getting the list of fortunes for a given flavor - 05. Handling errors - 06. Getting a random number between two values PART 3: Adding interactivity to the page - 07. Selecting page elements with document.querySelector - 08. Reacting to events with event listeners - 09. Finding the chosen flavor - 10. Searching through an array - 11. Modifying the page content with innerHTML PART 1: Single-column Layouts - 01. Laying down our Cascade: setting and overriding defaults - 01.a Styling the <body> with a tag-based selector - 01.b Default values and the cascade - 01.c Setting a fallback font family for our page - 01.d Setting a responsive font size for our page - 02. Keeping your CSS values consistent with custom properties - 03. Single-column layouts pt.1: a responsive, centered column - 03.a Making your column's width shrink and grow with the window - 03.b Horizontally centering your column - 03.c Stretching a column to the full height of the page - 04. Single-column layouts pt.2: arranging and aligning content - 04.a Making your elements "flex" into a vertical column - 04.b Adding space between your elements (but not around them) - 04.c Centering the content inside the column * PART 2: Text, Borders, and Layered Images - 05. Styling the container for our fortunes - 05.a Centering a single element... - 05.b ...and the text inside it! - 05.c Setting a width based on text content - 06. Overlapping an image with its surrounding content... - 06.a ...and layering it on top of its siblings! - 07. Muted text color with opacity - 08. Balancing multi-line text with text-wrap: balance - 08.a ...while checking browser support for this newer feature
November 18, 2025 at 10:55 PM
fujocoded.bsky.social
It's time to (soft) ship! 🚢🚢

Only one thing left to soft ship our digital pack, and that's... shipping it! If you got it back in April, you'll soon receive your hot-off-the-presses HTML/CSS/JS learn-along preview!

And if you haven't bought it yet..... now is the time! Price goes up in 24hrs!! 👇
todo list for week 4 (todo): everything related to packing up the pack. The reviewers and readme work is done, now it's missing the shipping. First image: Screencap of a preview for the Fortune Cookies site. Boba-tan, the FujoCoded mascot, is in a white and red robe with a light golden fortune cookie as a moustache. Boba-tan is standing against a tan background with red borders. Under Boba-tan is a white box with red border, and black text that reads “seek a fortune if you dare”. Under that is a clickable menu, asking for the user to select a vanilla, chocolate, or lemon fortune cookie, and a button saying “get a fortune”. Vanilla is selected. PART 1: Single-column Layouts - 01. Laying down our Cascade: setting and overriding defaults - 01.a Styling the <body> with a tag-based selector - 01.b Default values and the cascade - 01.c Setting a fallback font family for our page - 01.d Setting a responsive font size for our page - 02. Keeping your CSS values consistent with custom properties - 03. Single-column layouts pt.1: a responsive, centered column - 03.a Making your column's width shrink and grow with the window - 03.b Horizontally centering your column - 03.c Stretching a column to the full height of the page - 04. Single-column layouts pt.2: arranging and aligning content - 04.a Making your elements "flex" into a vertical column - 04.b Adding space between your elements (but not around them) - 04.c Centering the content inside the column * PART 2: Text, Borders, and Layered Images - 05. Styling the container for our fortunes - 05.a Centering a single element... - 05.b ...and the text inside it! - 05.c Setting a width based on text content - 06. Overlapping an image with its surrounding content... - 06.a ...and layering it on top of its siblings! - 07. Muted text color with opacity - 08. Balancing multi-line text with text-wrap: balance - 08.a ...while checking browser support for this newer feature
November 18, 2025 at 10:55 PM
fujocoded.bsky.social
Here's our final table of content! For our (hopefully) last update, we've tweaked the CSS lessons to feature FOUR PARTS.

Not only this makes the later sections less overwhelming, but it allowed us to add extra content on accessibility issues 👀

Buy it here: store.fujocoded.com/products/oth...
- 01. Clean up the styling slate with a CSS reset - 02. Wait to run JavaScript until the page is ready - 03. Tell screen reader users about content updates - 04. Get the browser's help with single-choice options - 05. Pre-select your options - 06. Create comfortable—and accessible!—inputs with labels PART 1: Declaring our fortunes - 01. Using arrays to store our fortunes - 02. Naming conventions - 02.a Naming conventions – Screaming Snake Case - 02.b Naming conventions – Camel Case - 02.c Naming conventions – Why we use them PART 2: Declaring our functions - 03. Using functions to organize our code - 04. Getting the list of fortunes for a given flavor - 05. Handling errors - 06. Getting a random number between two values PART 3: Adding interactivity to the page - 07. Selecting page elements with document.querySelector - 08. Reacting to events with event listeners - 09. Finding the chosen flavor - 10. Searching through an array - 11. Modifying the page content with innerHTML PART 1: Single-column Layouts - 01. Laying down our Cascade: setting and overriding defaults - 01.a Styling the <body> with a tag-based selector - 01.b Default values and the cascade - 01.c Setting a fallback font family for our page - 01.d Setting a responsive font size for our page - 02. Keeping your CSS values consistent with custom properties - 03. Single-column layouts pt.1: a responsive, centered column - 03.a Making your column's width shrink and grow with the window - 03.b Horizontally centering your column - 03.c Stretching a column to the full height of the page - 04. Single-column layouts pt.2: arranging and aligning content - 04.a Making your elements "flex" into a vertical column - 04.b Adding space between your elements (but not around them) - 04.c Centering the content inside the column * PART 2: Text, Borders, and Layered Images - 05. Styling the container for our fortunes - 05.a Centering a single element... - 05.b ...and the text inside it! - 05.c Setting a width based on text content - 06. Overlapping an image with its surrounding content... - 06.a ...and layering it on top of its siblings! - 07. Muted text color with opacity - 08. Balancing multi-line text with text-wrap: balance - 08.a ...while checking browser support for this newer feature PART 3: Pseudo-classes, Transforms, and Advanced Selectors - 09. Styling HTML elements by attribute - 10. Make radio buttons match our accent color - 11. Sizing elements to match the nearby text - 12. Aligning radio buttons with their labels - 13. Growing a flex child to fill the available space - 14. Styling the selected option with CSS pseudo-classes... - 14.a ...and turning its radio button 3D with filters and box-shadow - 15. Styling adjacent elements with the sibling selector - 16. Applying special styles on mouse hover - 16.a Embiggening or shrinking elements with the scale() transform * PART 4: Interactions, Effects & Responsive Media Queries - 17. Combining selectors for more specific targeting - 17.a A cascade of fallback values with CSS variables - 17.b Using your mouse pointer to hint at interactivity - 18. Effects galore: scale 'em, rotate 'em, and change their color! - 18.a Temporarily changing custom properties on hover - 19. Styling elements on interaction with the :active pseudo-class - 20. Accessible keyboard navigation with :focus-visible - 20.a Using "outline" to draw floating borders - 21. Media queries to the rescue: styling for different screen sizes - 22. ...and styling for different abilities *
November 17, 2025 at 8:37 PM
fujocoded.bsky.social
It's TOMORROW!

With our learn-along back from reviewers, we're officially "just packing up". Next step, delivering the learn-along to the inboxes of those who bought it in April 🏃‍➡️📬

Buy it here for $5 before the price goes up: store.fujocoded.com/products/oth...

Final table of content below! 👇
todo list for week 3 (todo): everything related to packing up the pack. The reviewers and readme work is done, now it's missing the packing.
November 17, 2025 at 8:37 PM
fujocoded.bsky.social
Updating the store for release with a better description, previews etc. is on our todo list for the final launch. If you have feedback on what you were expecting to see, would love to hear🙏

when you say "sends you to an April post where you sold Actual cookies" you mean the link at the bottom here?
November 14, 2025 at 11:01 PM
fujocoded.bsky.social
...you still have some time to buy our HTML/CSS/JavaScript digital pack at the literal-steal-we-swear price of $5, before it increases after our imminent soft launch.

Check out the table(s) of content for our "random generator" learning pack👇🖼️ and buy it here👇🔗💖

store.fujocoded.com/products/oth...
PART 1: Single-column Layouts - 01. Laying down our Cascade: setting and overriding defaults - 01.a Styling the <body> with a tag-based selector - 01.b Default values and the cascade - 01.c Setting a fallback font family for our page - 01.d Setting a responsive font size for our page - 02. Keeping your CSS values consistent with custom properties - 03. Single-column layouts pt.1: a responsive, centered column - 03.a Making your column's width shrink and grow with the window - 03.b Horizontally centering your column - 03.c Stretching a column to the full height of the page - 04. Single-column layouts pt.2: arranging and aligning content - 04.a Making your elements "flex" into a vertical column - 04.b Adding space between your elements (but not around them) - 04.c Centering the content inside the column PART 2: Text, Borders, and Layered Images - 05. Styling the container for our fortunes - 05.a Centering a single element... - 05.b ...and the text inside it! - 05.c Setting a width based on text content - 06. Overlapping an image with its surrounding content... - 06.a ...and layering it on top of its siblings! - 07. Muted text color with opacity - 08. Balancing multi-line text with text-wrap: balance - 08.a ...while checking browser support for this newer feature PART 3: Buttons, States, and Hover Effects - 09. Styling HTML elements by attribute - 10. Make radio buttons match our accent color - 11. Sizing elements to match the nearby text - 12. Aligning radio buttons with their labels - 13. Growing a flex child to fill the available space - 14. Styling the selected option with CSS pseudo-classes... - 14.a ...and turning its radio button 3D with filters and box-shadow - 15. Styling adjacent elements with the sibling selector - 16. Applying special styles on mouse hover - 16.a Embiggening or shrinking elements with the scale() transform - 17. Combining selectors for… - 01. Clean up the styling slate with a CSS reset - 02. Wait to run JavaScript until the page is ready - 03. Tell screen reader users about content updates - 04. Get the browser's help with single-choice options - 05. Pre-select your options - 06. Create comfortable—and accessible!—inputs with labels PART 1: Declaring our fortunes - 01. Using arrays to store our fortunes - 02. Naming conventions - 02.a Naming conventions – Screaming Snake Case - 02.b Naming conventions – Camel Case - 02.c Naming conventions – Why we use them PART 2: Declaring our functions - 03. Using functions to organize our code - 04. Getting the list of fortunes for a given flavor - 05. Handling errors - 06. Getting a random number between two values PART 3: Adding interactivity to the page - 07. Selecting page elements with document.querySelector - 08. Reacting to events with event listeners - 09. Finding the chosen flavor - 10. Searching through an array - 11. Modifying the page content with innerHTML
November 14, 2025 at 10:39 PM
fujocoded.bsky.social
It is done 🎉👯 The preview of our digital pack has been packaged and sent out to our reviewers for a pre-preview pre-check.

Alas, we were a bit too late to make our self-imposed deadline of, well, TODAY, but we'll be shipping it as soon as we get the "good to go".

In the meantime... ⬇️🧵
TODO list for week 3 (cleared): all repository clean up todo list for week 3 (todo): everythign related to packing up the pack
November 14, 2025 at 10:39 PM
fujocoded.bsky.social
This price is set to increase after the soft launch, then again after our hard one on November 27th!

Not only that, you'll get early access to the expanded "fancy" edition for FREE, with even more real-world knowledge that's useful for people like you 🫵💖 written in a language you 🫵💖 can understand!
HTML Sample: Create comfortable—and accessible!—inputs with labels CSS sample: Stretching a column to the full height of the page JS Sample: Selecting an HTML element with document.querySelector
November 7, 2025 at 7:30 PM
fujocoded.bsky.social
...snatch this guide at the lowest price this side of the launch! For the lowest-it’ll-ever-be price of $5, you can get your fill of:

- website goodies 🌐
- wallpapers 🖼️
- ...and a fun, accessible HTML/CSS/JS learn-along for website tinkerers yearning to grow and explore useful, modern techniques!
First image: Screencap of a preview for the Fortune Cookies site. Boba-tan, the FujoCoded mascot, is in a white and red robe with a light golden fortune cookie as a moustache. Boba-tan is standing against a tan background with red borders. Under Boba-tan is a white box with red border, and black text that reads “seek a fortune if you dare”. Under that is a clickable menu, asking for the user to select a vanilla, chocolate, or lemon fortune cookie, and a button saying “get a fortune”. Vanilla is selected. Table of contents for the HTML file Table of contents for the CSS file Table of contents for the JS file
November 7, 2025 at 7:30 PM
fujocoded.bsky.social
Week 2 has officially started, and we still have a lot to get through! Soft launch is planned for the 14th, and this is just part of the to-do list! But we can and will hit it!! Go go go 🌟🏎️🏁
A to-do list for the Fandom Cookies Digital Pack. Prophet Boba-tan looks very cute with her fortune cookie moustache and remarks, it's step by step? Let's Get Cookie-ing! Week #2 Repository clean up (checked off as completed) CSS lesson pass #1 (checked off as completed) CSS lesson pass #2 README draft #1 Last re-read Packed & Sent for Beta!
November 5, 2025 at 11:11 PM
fujocoded.bsky.social
On one hand, the style of box we're using for our CSS sections is so much harder to do little language tweaks compared to our JS one. But on the other hand...pretty ✨

Get it here: store.fujocoded.com/products/oth...
Part 1 of the CSS fortune generator lesson, featuring an intricate wavy box Part 1 of the JS fortune generator lesson, featuring a box made of # characters
November 5, 2025 at 11:11 PM
fujocoded.bsky.social
The horrors—errrm, "unforeseen happenstances" persist, but so do we! The week isn't over until Tuesday, and there's still time to get most of these done 😤 What could go wrong?

Once again, send us your spirit energy, and hold us accountable for a recap of what got done in... 3 hours or so?
A to-do list for the Fandom Cookies Digital Pack. Prophet Boba-tan looks very cute with her fortune cookie moustache and remarks, slow but steady! Let's Get Cookie-ing! Week #1 Repository clean up (checked off as completed) CSS lesson pass #1 CSS lesson pass #2 README draft #1 Last re-read Packed & Sent for Beta!
November 2, 2025 at 11:39 PM
fujocoded.bsky.social
The result of yesterday's hard work: a bunch of new issues filed for both AO3.js and Astrolabe!Look through them, find yours, and come help us bring forward a easier-to-build, more open web for fandom and beyond.

Links & how to get involved 👇🧵

All skills (and skills level) welcome 🌟
Astrolabe issues, which you can find on GitHub AO3.js issues, which you can find on GitHub
October 31, 2025 at 7:54 PM
fujocoded.bsky.social
We're gearing up for an end-of-November release, just in time for the Black Friday hype! This is plenty of time, in theory... but that just makes it easier to procrastinate.

We'll be posting accountability updates as we count down towards our soft launch. Poke us if you notice us slip!
October 29, 2025 at 10:33 PM
fujocoded.bsky.social
📝 A lot of our to-do list has been knocked down already, but a few pesky items remain: they're short but mighty, amplified by the terrifying combination of "last stretch" and "things won't stop happening".

So, dear fujin, we need you to become our buddies... accountability buddies, that is! 🤝✨
A to-do list for the Fandom Cookies Digital Pack. Prophet Boba-tan looks very cute with her fortune cookie moustache and says, So much to do! Let's Get Cookie-ing! Week #1 Repository clean up CSS lesson pass #1 CSS lesson pass #2 README draft #1 Last re-read Packed & Sent for Beta! So far, all items are unchecked.
October 29, 2025 at 10:33 PM
fujocoded.bsky.social
🌟 Project Countdown 🌟

We're almost ready to wrap up—and sell!—our Fortune Cookies Digital Pack. But as we get closer to done, one problem recurs: with so much to do all around, our attention keeps getting scattered!

It's time to do what we too often forget to do: ask for help. YOUR help!
Fandom Cookies — Digital Items Pack (Preorder Item) — prophet boba-tan with a beautiful fortune cookie mustache and html/css/js text bubble
October 29, 2025 at 10:33 PM
fujocoded.bsky.social
If what you saw up there ☝️ looked impressive, know we couldn't do it without... you! And so, here's the open opportunities for this edition, which you can find (and apply for) in our hiring page: fujocoded.com/hiring (fujocoded.com/hiring)

Help us share our work and launches with everyone!
It remains true, month after month: writers, coders, and artists are always welcome to submit their business cards via our Business Cards Drop-off Forms. When hiring opportunities arise, we always pull these contacts up as we search for the right candidates! Speaking of which, welcome to the special contracting opportunities we’re hiring for at this time 👇 💰Digital Relea$e: Are you a hype-generating machine? Do you know how to make online dwellers’ hearts go doki doki? Help us create a release plan for our upcoming Digital Pack! While you won’t have to do everything yourself, we need your help thinking through this launch, and planning (maybe even writing) content that gets all our supporters to share our joy…and, hopefully, their money. 💰WRITEME.md: Do you like writing? Do you like (even just some) coding? Do you love the idea of empowering others to, as they say, “supercharge” their coding powers with pre-made libraries or integrations? Come write the README.md files for our repositories, and tell others how to put our code to their own use! First step: our WIP @fujocoded/authproto integration, which adds ATproto authentication to any Astro site and lets visitors log in.
August 28, 2025 at 9:46 PM
fujocoded.bsky.social
And—almost last!—something you might not believe we do, but that we spend quite a bit of time on, and are going to showcase more: CODE for everyone to use and contribute to.

Check out some of the libraries and tools we worked on, and get the links in the newsletter:

fujocoded.com/updates/25-0...
In the (Git)hub Plugged In: A new Astro plugin Integration has landed! @fujocoded/astro-dev-only lets you hide any page of your Astro website from the prying eyes of visitors, making them only available during development! Big power, big JavaScript crimes. Wall Pa(m)pered: Our “HTML&CSS Wallpaper Maker” got an upgrade! The Fortune Cookies wallpapers (soon in our digital pack!) dusted off our memory of its inner workings, which means we’ve released our “internal upgrades” for everyone to enjoy. You too can now create HTML snippets to reuse multiple wallpapers. What better way to practice your HTML & CSS? Make some wallpapers, and share them with us on socials! Long Staffed: @bobaboard/ao3.js got a tiny bit more powerful thanks to a short-but-mighty external contribution: our friend Gingerchew—thank you!—added built-in support for short “ao3.org” links! If you wish to follow in their footsteps, we’d love to help you open or grab an issue, or be a “pinch-hitter” for an open Pull Request. All skill levels are welcome!
August 28, 2025 at 9:46 PM
fujocoded.bsky.social
Catboys are a tough act to follow, but some of our most important work is simply talking about the reality of the web, indie development, and (most importantly) working together!

Our latest talk is "Working Together in a Dying World" (read author notes!)

essentialrandomness.com/working-toge...
A slide of a presentation with comments placed over it. The slide says &quot;Working Together in a Dying World (in Comic Sans) by FujoCoded&quot; and the comments say &quot;there are people out there who feel like I do but are coherent enough to make presentations about it&quot; &quot;this was what I needed&quot; &quot;graphics are incredible, 10/10, laughing as I cry&quot;
August 28, 2025 at 9:46 PM