Forem: Michael J. Larocca

Turning Learning Into Opportunity: Social Media Strategies from Marko Denic

Michael J. Larocca — Tue, 17 Feb 2026 22:43:07 +0000

Introduction

Struggling to break into tech? You’re not alone. But the good news is, you can turn those challenges into real opportunities! In this article, you’ll learn how Marko Denic—full-stack developer, educator, agency owner, and tech community leader—grew his combined audience from zero to 300,000, and you’ll discover actionable steps to kickstart your own journey!

In this exclusive podcast coverage article, Mike Karan sat down with Marko to uncover his top strategies for standing out in a tough job market, building real connections, showcasing your work, and using AI as a developer. You’ll see how Marko leveraged social media and authentic relationships to turn his following into job opportunities and sponsorships. His practical advice can help YOU reshape your approach and fast-track your tech career!

Here’s what you’ll find inside:

Leveraging Social Media: Strategies for using platforms like X and LinkedIn to build your reputation, share your work, and attract opportunities in tech.
How to Provide Real Value: Ways to offer genuine help, resources, or insights to the tech community, making yourself memorable and valuable to others.
Building Connections: Practical advice for forming authentic relationships with peers, mentors, and industry leaders that can open doors in your career.
How to Stand Out: Tips for showcasing your skills and projects effectively so you get noticed by employers and collaborators in a competitive job market.
Navigating AI: Guidance on integrating AI into your workflow, using it to boost productivity, and understanding its role in learning and career growth as a developer.

Leveraging Social Media

Marko’s success in building his large social media following didn’t come from gaming the system or using hacks. He gained it by being genuine, providing real value, and making meaningful one-on-one connections.

When you’re genuine in your interactions and content you post, people notice. But if you’re only posting to make a sale, people notice that even more! In the long run, being disingenuous works against you.

You can provide real value by sharing your learnings, no matter where you are in your coding journey. Even if you’re just starting out, your experiences and insights can help others who are a few steps behind. Sharing what you’ve learned not only supports the community but also deepens your own understanding and builds your confidence (and your reputation)!

When you’re starting out on social media, your goal of gaining a large following may be too ambitious. Instead of trying to attract the masses all at once, focus on building meaningful one-on-one connections. Take the time to reply to comments, answer questions, and reach out to others in your community. These personal interactions will help you stand out, create trust, and achieve real engagement. This authentic approach will lay the groundwork for genuine growth.

How to Provide Real Value

Feeling like you need to become an expert before sharing your learning on social media is a common pitfall. As the wise saying goes, you can learn something from anybody, so just start! Some of the best teaching advice my father gave me was to simply stay one page ahead of the students. That same approach works for sharing what you’re currently learning: aim to teach a coder who is just one step behind you. This way, you can get started at any point in your coding journey, without fear.

When you share what you’re learning, include the difficulties you faced as well as the solutions you found. By bonding over these learning struggles, you’ll provide real value and make genuine connections with others.

Another famous saying I find helpful when contemplating a programming topic is this: If you can’t thoroughly explain a topic, you don’t thoroughly know it. If you're like me, most of the time you’re just trying to get a part of your program to work, no matter what the problem is. Once you overcome the problem, you’re right back to working on your project, and when the project is done, it’s on to the next one. Without understanding the underlying issues and learning from them, you’ll most likely run into similar problems again and not grow as a developer. Taking the time to step back and figure out how you got your code to work—and then sharing it, whether in a post, article, video, or any method you like—will reinforce what you’re learning, help you get better at articulation, and provide real value to the community.

Building Connections

Once you start sharing your learnings on social media, you will organically gain genuine followers who resonate with your content. When that happens, consider following them back, interacting with their posts, and offering further insights or solutions to their problems. Doing so will help you build connections that can be mutually beneficial in the future.

Quincy Larson, the founder of freeCodeCamp, shares this valuable insight in a previous podcast coverage article: companies often search within their networks for candidates—sometimes even before, or instead of, advertising the job. Building connections through consistent networking can bring job opportunities directly to you, just as it does for Marko!

The key to successfully building connections is to be genuine. Avoid reaching out to others, especially those with larger followings, with the intent of personal gain. A better approach is to connect with people who share your interests and offer your help. In fact, Marko reached out to podcast host Mike, making the initial connection even though Mike had a much smaller following than he did!

If you’re looking for inspiration on how to build real connections, Richard Choi is a perfect role model. In my journey, I have never met anyone better than Richard Choi at making meaningful one-on-one connections! He attends conferences, meetups, online events, and has plenty of one-on-one coffee chats. The background collage of his website, shown in the image below, features pictures and screenshots from his events. It’s extremely impressive. I’ve met Richard in person, chatted with him online, and worked with him in the Gridiron Survivor Apprenticeship Program. I can vouch for him—he is genuine! If you want to learn firsthand how to make meaningful one-on-one connections, connect with Richard!

How to Stand Out

How do you stand out in a tough job market, where demand is low, and expectations are sky-high? Marko’s advice: make something that works! It could be a website, project, app, or anything, ideally something you are passionate about. First, focus on making it work. Then, improve it to make it better. After that, get feedback and, if it’s good, implement it as well. Showing you can create something that actually works demonstrates your skills and can open up new opportunities when you put it out there.

To really showcase your work, share your project and its process on social media. Show that you can take a project from start to finish, including deployment. Don’t worry if your project’s concept has been done a dozen times before. Even if your project is similar to others, they might not work well; yours could be better! Marko says, market it well and market it often. That’s what will make you stand out!

Another way to stand out is by working on an open-source team project. This demonstrates that you can collaborate, have acquired real team experience, and can use team-based tools such as version control. I’m in the Gridiron Survivor Apprenticeship Program, and I can vouch for how much you’ll learn and the experience you’ll gain building open-source projects with a team. Having team experience also makes you a stronger job candidate and a more enticing hire, since your onboarding process will be much quicker and smoother.

One of Marko’s best tools is his free custom QR code generator. You can make QR codes for links, text, and more in just a few clicks. You can also tweak the color, adjust the size, and share your codes with friends using the social media share buttons. Below is a custom QR code I made for my personal blog using Marko’s tool.

Using AI Effectively

Jokingly speaking, to prevent the HTML All The Things podcast from being canceled, Mike asked Marko for his take on AI and how he uses it.

Marko uses AI daily, but he’s clear that he remains in control—not the AI. He handles all the complex coding himself, relying primarily on AI as an assistant for writing tests, handling utility tasks, brainstorming ideas, and creating project scaffolding.

In Marko’s experience, letting AI take control can be counterproductive. The more complex the app, the more time he spends refactoring AI-generated code. Marko notes that he often ends up dedicating so much time to cleaning up the output that he could have finished the app faster if he had built it from scratch!

Mike has a similar perspective on AI; he uses it as a tool to increase his efficiency. However, he has mixed feelings about the use of AI in coding and is sometimes reluctant to prompt code into existence because he prefers solving problems on his own without interruption. Specifically, he finds the AI auto-correct feature disruptive at times.

As an experiment, he turned off the AI and coded a custom feature himself, which took about an hour. Then, he prompted the AI to write the same feature. As expected, the AI completed it in just 2 to 5 minutes using similar code, though not in the style he would have chosen. This realization, as he put it, “took the wind out of his sails” and only added to his impostor syndrome. On a positive note, Mike points out that he still outperforms AI at certain tasks, especially complex problem-solving and reasoning. He’s also found that AI currently struggles with long-term project management.

Mike uses AI to increase his efficiency by first prompting it to write a feature, then reviewing and editing the code as needed. Especially when working with clients, this approach streamlines his workflow and improves time management, making his work more cost-effective. However, Mike adds an important caveat: to achieve this, you need a solid grasp of programming fundamentals to effectively review and refine the code produced by AI.

How does one truly learn programming fundamentals? If you rely on AI to learn how to code before mastering the basics yourself, you limit the depth of your understanding. This makes it much harder to review and improve the code that AI generates for you. Consider turning off AI when learning the fundamentals—the struggle is where real growth happens. Be like Mike! Mike learned to code in a pre-AI era—a time of learning through trial and error!

With how easy AI makes coding, it's tempting to skip the hard parts and rely on it for everything. But as Mike points out, if you don’t learn the fundamentals through struggle, you’ll end up with only a surface-level understanding. When you put in the effort to really learn, make mistakes, and grow, and then use AI as a tool, not a crutch, you’ll stand out. Share that journey online, and you’re not just learning; you’re showing the world what you can do. That’s how you turn learning into opportunity!

Marko’s Links

Website: https://markodenic.com/
Newsletter: https://markodenic.tech/newsletter/
X account: https://x.com/denicmarko
LinkedIn: https://www.linkedin.com/in/denicmarko/
YouTube: https://www.youtube.com/@MarkoDenicTech/featured

About Marko Denic

Marko Denic is a software engineer, content creator, and community builder dedicated to helping developers improve their skills and monetize content. As the founder of Marko Denic Tech, he creates a variety of free tools and resources to streamline workflows and enhance productivity. Marko is passionate about web development, shares real-life tips and resources through his writing, and maintains an active presence in the tech community.

My other related articles

Don't miss this episode – tune in to the Podcast now!

🎙Leveraging Social Media and Content Creation | w/ Marko Denic

Stay up to date by following HTML All The Things on our social channels.

Be sure to check out podcast host Matt Lawrence’s featured article in Marko’s newsletter, ES6 JavaScript!

How to support the show

Patreon

Prices are subject to change and are listed in USD

Support the show from as little as ~$1/month
Get a shoutout at the end of the episode (while supplies last) for just ~$3/month
Help support the HTML All The Things Podcast: Click Here

Learn with Scrimba!

Learn to code using Scrimba with their interactive follow-along code editor.

Join their exclusive Discord communities and network to find your first job!

Use our affiliate link for an exclusive 20% discount!

Click our link to explore the new Scrimba 2.0 and start learning!
Make an account
You'll then have the option to upgrade to pro content (and you should see our 20% discount listed!)
Discount is for new accounts only

This article contains affiliate links. If you make a purchase through these links, we may receive a commission at no extra cost to you. This helps us continue to provide valuable content. Thank you for your support!

I’m excited to announce that I’m now a Torc Ambassador! As part of this global community, I’ll be sharing valuable insights from Torc’s virtual events, lessons from my own tech journey, and real-world perspectives on how teams are hiring and working today. I’ll be active in the Torc community through posts, events, Q&A sessions, and more—so stay tuned for updates and opportunities to connect. Whether you’re looking to advance your tech career or simply stay informed, I hope the insights I share will support and inspire you on your journey!

Torc is an AI-powered platform and vibrant global network that connects skilled professionals with top opportunities and forward-thinking companies. If you’re interested in joining, you can create a free profile using my referral link: https://platform.torc.dev/#/r/b5QZ7k5h/cp

Conclusion

Marko Denic did not gain a combined audience of 300,000 followers by gaming the system. He built it through authentic engagement, consistently sharing his learning journey, providing real value, and forming genuine connections in the tech community. By helping, collaborating, and showcasing real projects, Marko turned steady effort into lasting influence and new opportunities. If you follow these proven strategies, you can build your own reputation and unlock doors in tech!

Don’t wait to get started! You don’t need to be an expert to start sharing what you’re learning. Help those just one step behind, and be open about your struggles as well as your solutions. This not only provides real value but also makes you relatable and authentic, helping you form meaningful connections. Teaching and explaining what you learn deepens your understanding and supports your growth as a developer. Reflecting on and sharing how you solved problems strengthens your skills and benefits the entire community.

Meaningful connections start with genuine interaction. Engage with others by following back, communicating, and offering help. Focus on shared interests and supporting others, rather than just seeking personal gain. Regardless of an individual’s audience size, reach out and make real connections as Marko does. Remember, many job opportunities come through networking within your community, not just from job boards. Sometimes, all it takes is one authentic connection for someone to recommend you for your next role.

To stand out in a crowded job market, focus on building projects that actually work, especially ones you’re passionate about, and keep refining them. Show you can take ideas from start to finish by sharing both your projects and your process. Don’t worry if your project isn’t original; as Marko says, execution and consistent marketing matter most. Participating in open-source team projects also highlights your collaboration skills and experience with tools and workflows, giving you a competitive advantage as a candidate to hire!

When it comes to working with AI, it can be a powerful ally, but only after you’ve mastered the fundamentals. Learn the basics first, then use AI to speed up tasks and spark new ideas, but never let it replace your core skills or critical thinking. Use AI as a tool to increase your efficiency, not as a crutch. In today’s tech industry, programmers who use AI effectively will have an edge over those who do not.

The tech world rewards those who learn, share, and connect, so start today! Put yourself out there, help others, and let your work speak for itself. Your next opportunity could be just one project, post, or conversation away!

Let's connect! I'm active on LinkedIn and Twitter.

You can read all of my articles on selftaughttxg.com

Learn to Code for Free and Land Your First Developer Job

Michael J. Larocca — Fri, 06 Feb 2026 20:23:57 +0000

Introduction

Whether you want to switch careers, advance in your current job, or launch a lucrative side hustle, learning to code can unlock countless opportunities! In this special guest issue, freeCodeCamp founder Quincy Larson shares how the platform helps people from all backgrounds learn essential coding skills and break into the tech industry. From mastering the basics and building an impressive portfolio to preparing for interviews and landing your first developer job, freeCodeCamp’s comprehensive curriculum guides you every step of the way. You’ll also find a supportive community through Discord, active forums, and in-depth articles, providing the encouragement and resources you need to stay motivated and succeed. Learn to code with freeCodeCamp and gain the skills you need to advance your career—for FREE!

Topics covered in this article include:

How to learn coding for free with freeCodeCamp’s hands-on curriculum
Balancing coding with work, family, and other commitments
Using AI wisely as a coding assistant
Building real projects, portfolios, and job-ready skills
Tips for landing your first developer job and accessing more free resources

What is freeCodeCamp?

freeCodeCamp is a nonprofit organization and online learning platform dedicated to making coding education accessible to everyone, everywhere. Their platform offers a comprehensive, self-paced curriculum covering in-demand skills such as HTML, CSS, JavaScript, Python, and more.

Learners progress by building real-world projects and earning certifications, all for free! Whether you’re a total beginner or looking to advance your skills, you can practice coding directly in your browser, gain hands-on experience, and join a supportive global community of fellow learners and developers.

Why Learn Coding With freeCodeCamp?

Learning to code for free and then landing your first developer job is a bold claim, so let me back it up with some statistics. According to freeCodeCamp, more than 100,000 of its graduates now work at companies worldwide, including top tech firms such as “F.A.A.N.G.” (Facebook, Apple, Amazon, Netflix, and Google). Notable alumni include Shawn Wang, who became a software engineer at Amazon; Sarah Chima, who began her developer career at ChatDesk; and Emma Bostian, who now works at Spotify. All of them studied with freeCodeCamp, which played a significant role in their career progress.

Every year, thousands of people in the freeCodeCamp community get their first software developer job after completing the curriculum. The organization regularly publishes inspiring stories from alumni who began as complete beginners, built real-world projects, earned certifications, and then went on to secure jobs in tech.

These outcomes, along with the size of freeCodeCamp’s global community, show that with dedication and the right free resource, landing your first developer job is absolutely possible!

How You Learn With freeCodeCamp

You learn with freeCodeCamp by following their thoroughly designed, cohesive linear curriculum. It has a clear beginning and end and allows you to skip over topics you already know. You’ll start with the fundamentals: HTML, CSS, and JavaScript, then advance to more complex topics, earning certifications as you complete each stage. As you progress, you’ll gain practical experience by building real projects and deepening your understanding of essential programming concepts. All of this is designed to help you become a hirable developer!

Recommended curriculum includes:

Responsive Web Design Certification
JavaScript Certification
Front End Development Libraries Certification
Python Certification
Relational Databases Certification
Back End Development and APIs Certification
Certified Full Stack Developer Curriculum

In addition to the core curriculum, freeCodeCamp offers a coding challenge of the day to help you practice consistently and sharpen your skills. You can also take advantage of language learning resources, such as English for Developers, Professional Spanish, and Professional Chinese, which are tailored for the global tech industry. For those preparing for job applications, freeCodeCamp provides interview preparation materials and resources to help you get ready for the developer job search. You’ll also become part of a supportive global community of learners and developers. Best of all, every aspect of freeCodeCamp’s platform is completely free!

With this comprehensive approach and a commitment to continually improving and expanding their course offerings, freeCodeCamp supports your journey from beginner to job-ready developer, helping you build a well-rounded education in tech.

My freeCodeCamp Certification

Education and Certifications for Tech Careers

When preparing for a career in tech, both formal education and industry certifications can help you stand out to employers. As a former school teacher himself, Quincy places a high value on traditional education. If college is an option, he recommends earning a computer science degree, as it is often the most beneficial path for those seeking a career in tech. However, he acknowledges that significant student loan debt can be a barrier, so he suggests considering community colleges and state universities. If he could change one thing, Quincy says he would wave a magic wand and make universities free for everyone! A college degree can open more doors, since some employers require it, and it may give you an edge over other job seekers who do not have one.

It’s also important to note that not all tech roles require a college degree—many employers place a high value on demonstrable skills, real-world experience, and strong project portfolios. By building and showcasing your abilities through projects and certifications, you can stand out to potential employers even without a traditional degree.

Quincy also suggests earning additional industry-recognized certifications, such as Amazon AWS and Microsoft Azure credentials, to validate your technical skills. freeCodeCamp offers free YouTube courses for many of these in-demand certifications, led by CTO Andrew Brown, who has personally taken and passed the exams. To deepen your learning, you can also explore Andrew’s ExamPro platform. In many cases, strong skills and relevant certifications can be just as valuable as a degree, especially for roles that emphasize practical experience.

While skipping school might seem appealing, Quincy encourages those between 25 and 30 to consider earning a traditional degree. Just be mindful not to overspend in the process. Ultimately, whether you choose a degree, certifications, or both, investing in your education is a smart step toward a career in tech.

Empowering Busy Adults

freeCodeCamp was created with busy adults in mind. If you’re working full-time, raising children, caring for family, or starting over after setbacks, the program is designed for your real-life challenges.

The curriculum is crafted by educators who break down complex topics into manageable steps. Each module includes comprehension checks, practical tips, and test suites to reinforce your skills. You build in-demand, job-ready abilities for a career in software engineering, all on a flexible schedule that fits your life.

Busy schedules are not a barrier to learning with freeCodeCamp. The program is 100% self-paced, so you can fit study sessions in before work, after the kids are asleep, or during breaks. There are no deadlines to worry about. Many learners have successfully completed the curriculum while managing jobs and family responsibilities. Consistency is key, and progress adds up over time.

Getting job-ready looks different for everyone. Some learners finish in a year, while others take two or more. The important thing is steady advancement, not rushing or putting your life on hold. Each module builds your practical, marketable coding skills and brings you closer to your goal.

If you get stuck, you are never alone. freeCodeCamp’s global community is active and welcoming. Join the forums, connect on Discord, or find a local study group. Whether you need help with a coding problem or just a bit of encouragement, mentors and peers are ready to support you.

Importance Of Learning The Fundamentals

In addition to freeCodeCamp’s curriculum, Quincy emphasizes the importance of learning programming fundamentals from books written by experienced teachers. To stay in line with the learning-for-free theme, consider checking your local library first. He tells us that nothing can substitute for the value of focused hours spent with well-curated materials from qualified instructors. Personally, I learned a great deal from the Sam’s Teach Yourself Series back in the day.

And yes, the substitute I’m referring to here is AI! While AI might seem like a quick way to pick up the basics, relying on it to spot-learn the fundamentals often leaves you with spotty results.

Quincy points out, however, that once you’ve learned a language—such as a scripting language—it can be beneficial to use AI when picking up another. In this context, AI can help you quickly grasp the new language’s syntax without being detrimental, since you already have a strong foundation from the first language you learned.

AI in Coding: Tool, Not Crutch

Vibe coding, prompt coding, and AI coding—oh my! With so many code-assisting tools available, how should you approach learning to code? Quincy advises against relying on AI to learn coding fundamentals. While it might save time initially, it can cost you more in the long run. Imagine using AI to generate the foundation of a website, then continuing to build on top of it, adding new features. Without a solid understanding of the underlying, AI-generated code, you’ll struggle to troubleshoot issues as they arise. In some cases, you might even have to scrap the entire project and start from scratch. If you’re serious about landing a web development job, you need to be able to understand all code—whether it was created by AI, written by another developer, or even by yourself!

As a personal challenge, I built an Ahsoka-themed Star Wars React website (see repo), used AI as a pair programmer, and documented the process in an article series.

The pros of building with AI: it feels like having a personal mentor, you can write code above your current level, and you can ask AI to explain how each line works.
The cons: AI can sometimes misdirect you, provide inconsistent code, and lead to overdependence if you’re not careful.

After this experience, my current hot take on coding with AI is this: when you pair program with AI, you become the senior developer, and the AI acts as your junior. This approach lets you delegate tedious or repetitive tasks to the AI, speeding up your workflow and making development more efficient. The key is to stay in control—review and guide the AI’s code just as you would when mentoring a junior developer. Used thoughtfully, AI can enhance your workflow and help you grow as a developer, without falling into the trap of relying on it as a crutch.

The Importance of Hands-On Practice

Quincy explains that the true way to learn programming is through plenty of hands-on coding. He uses the analogy of a piano teacher and student: even with a great teacher, if the student only spends an hour a week at the piano during lessons, they won’t excel. Similarly, you can watch, read, and listen to excellent programming instructors, but without putting in many hours actually coding and building projects, you won’t truly learn how to program.

Now that we've discussed the value of learning to code by doing, how can you stay motivated to finish freeCodeCamp’s self-paced curriculum? One great way is by building passion projects! If you’re like me, you might be interested in creating video games. freeCodeCamp instructor Ania Kubow teaches web development through game projects like Pac-Man and Tetris. Her minimalist approach helps you focus on core programming concepts while giving you plenty of freedom to add your own styling and unique game mechanics. These side projects not only keep you engaged, but they also become valuable additions to your personal portfolio for others, including potential employers, to see.

Here are my Pac-Man (repo) and Tetris (repo) games, both inspired by Ania Kubow’s projects.

Preparing for Your Job Search

Once you complete freeCodeCamp’s web development curriculum, you’ll find a range of additional resources to help you prepare for technical interviews and the job search process. These resources are designed to strengthen your problem-solving skills, deepen your programming knowledge, and boost your interview confidence.

The Odin Project - freeCodeCamp Remix: An interactive, browser-based adaptation of the open-source Odin Project curriculum, maintained by the freeCodeCamp community. It offers hands-on projects and coding challenges based on the original Odin Project, making it easier to learn and practice web development skills without any software setup.
Coding Interview Prep: A curated collection of coding challenges, algorithm questions, and take-home projects designed to help you prepare for technical interviews and strengthen your programming portfolio.
Project Euler: A series of challenging mathematical and computational problems that help you improve your algorithmic thinking and coding skills, ranging from beginner to advanced difficulty.
Rosetta Code: A collection of classic programming tasks solved in many different languages, designed to expand your problem-solving skills and expose you to multiple ways of approaching coding challenges.

Job-Hunting Tips From Quincy’s Free Book

In his book, Quincy shares three important tips for developers seeking jobs:

You must have programming skills.
You must build your reputation.
You must network with people.

Quincy tells us there’s no way around it: you must have programming skills. Even if you pass the interview and land the job, it will be short-lived without them. You need to be capable of performing in the tech role you’re hired for and versatile enough to keep pace with the ever-changing tech landscape. If you can’t, you’ll be left behind.

In addition to your skills, you will also benefit from building up your reputation. The goal is to earn a reputation that precedes you. In other words, people you meet for the first time already know who you are and what you are capable of. With a strong reputation, you can streamline interviews, and companies might even reach out to you directly with offers.

Building your professional network can help you land jobs that are never advertised. Yes, you read that right! Companies often source talent by reaching out through their networks first, before advertising, and sometimes skip advertising altogether. For example, I secured my first paid technical writing role at the online coding school Scrimba through my network a week before it was publicly advertised. Your network can also help you recover quickly from a layoff, just as it did for people in my network: Brian Morrison landed a new job at Clerk just days after being laid off, and James Q. Quick received numerous offers after his layoff from PlanetScale.

📘 FREE Book! How to Learn to Code and Get a Developer Job

Exploring More Free and Affordable Learning Resources

Wondering where to continue your learning journey after freeCodeCamp? Here are some resources I’ve personally found valuable:

YouTube: You’ll find a wealth of instructors—like Brad Traversy, Kevin Powell, Gary Simon, and Kyle Cook (Web Dev Simplified)—who share high-quality free tutorials on a wide range of topics. They also offer paid courses, which I’ve purchased and can personally recommend.
Udemy: Purchase in-depth coding courses here (often available for just $10 during sales).
Scrimba: Features a broad range of free courses and a thriving community. Scrimba’s advanced learning system includes interactive screencasts (“scrims”) that let you pause teacher-led lessons and experiment with live code right in your browser. Their AI-powered Instant Feedback tool provides real-time code analysis, hints, and corrections to help you learn faster and more effectively. Many Scrimba instructors and courses are also featured on freeCodeCamp through their ongoing collaboration.

Invest in Yourself, The Future Is Bright!

Quincy feels optimistic about where the tech industry is headed. He urges you not to talk yourself out of pursuing a computer science degree or a career as a developer, even if the job market seems uncertain right now. While there’s a lot of hype around AI tools, they aren’t going to replace developers nearly as much as some people fear. As technology continues to evolve, the need for skilled developers will only increase to address new challenges. By investing in yourself and building your skills, you’re making a smart, long-term decision. If you’re ready to learn, build, and grow, software development is a field full of opportunity!

Quincy's Links

Website: https://www.freecodecamp.org/
freeCodeCamp Mobile App (Google Play | App Store)
Podcast: freeCodeCamp Podcast
Discord: discord.com/invite
Twitter/X: ossia
LinkedIn: quincylarson
📘 FREE Book! How to Learn to Code and Get a Developer Job

About Quincy Larson

Quincy Larson is a teacher and the founder of freeCodeCamp.org, a nonprofit community where millions of people around the world are learning to code together. Before starting freeCodeCamp in 2014, Quincy spent several years teaching and directing schools in both the US and China, where he also completed graduate work and became fluent in Mandarin. His journey into coding began with building scripts to automate school workflows, eventually leading him to work as a software engineer and freelance developer.

Quincy’s passion for education and technology inspired him to create freeCodeCamp—a 501(c)(3) public charity designed to make high-quality tech education accessible to everyone, everywhere. Today, he continues to lead the freeCodeCamp team, helping to design the curriculum, maintain the open-source platform, and grow a supportive global community of learners. Through his work, Quincy has helped tens of thousands of people land their first software developer jobs and continues to advocate for accessible, free education in technology.

My other related articles

Don't miss this episode – tune in to the Podcast now!

🎙Inside freeCodeCamp: Learning to Code in 2025 | w/ Quincy Larson

Stay up to date by following HTML All The Things on our social channels.

How to support the show

Patreon

Prices are subject to change and are listed in USD

Support the show from as little as ~$1/month
Get a shoutout at the end of the episode (while supplies last) for just ~$3/month
Help support the HTML All The Things Podcast: Click Here

Learn with Scrimba!

Learn to code using Scrimba with their interactive follow-along code editor.

Join their exclusive Discord communities and network to find your first job!

Use our affiliate link for an exclusive 20% discount!

Click our link to explore the new Scrimba 2.0 and start learning!
Make an account
You'll then have the option to upgrade to pro content (and you should see our 20% discount listed!)
Discount is for new accounts only

I’m excited to announce that I’m now a Torc Ambassador! As part of this global community, I’ll be sharing valuable insights from Torc’s virtual events, lessons from my own tech journey, and real-world perspectives on how teams are hiring and working today. I’ll be active in the Torc community through posts, events, Q&A sessions, and more—so stay tuned for updates and opportunities to connect. Whether you’re looking to advance your tech career or simply stay informed, I hope the insights I share will support and inspire you on your journey!

Torc is an AI-powered platform and vibrant global network that connects skilled professionals with top opportunities and forward-thinking companies. If you’re interested in joining, you can create a free profile using my referral link: https://platform.torc.dev/#/r/b5QZ7k5h/cp

Conclusion

The online coding school freeCodeCamp makes programming accessible to everyone through its hands-on, self-paced curriculum and supportive global community. Thousands of self-taught learners have landed their first developer jobs after completing the program.

As you progress, you’ll build real projects for your portfolio and gain practical, job-ready skills. Each completed course earns you a certification to enhance your resume, and specialized courses led by industry professionals can help you prepare for additional credentials, including those from Amazon and Microsoft.

You’ll spend plenty of time mastering programming fundamentals, which are an essential foundation before using AI-assisted coding tools. With a solid grasp of the basics, you can leverage AI as a valuable tool rather than relying on it as a crutch.

After finishing the curriculum, freeCodeCamp continues to support you with job search resources, technical interview preparation, and guidance for building your professional network and reputation.

The future of tech is bright, and skilled developers will remain in high demand! The rise of AI is opening new doors for those willing to learn and adapt. By investing in your skills and taking the first step today, you’re positioning yourself for lasting success in a field that values curiosity, persistence, and creativity. Whether you want to switch careers, advance in your current role, or launch a rewarding side hustle, now is the perfect time to learn to code and seize the lucrative opportunities in software development!

Let's connect! I'm active on LinkedIn and Twitter.

You can read all of my articles on selftaughttxg.com

Micro-Frontends: What They Are and Why You Should Use Them

Michael J. Larocca — Mon, 19 Jan 2026 20:47:19 +0000

In this continuing hackathon coverage article, we explore how the team is progressing in building an AI-powered travel agent app using micro-frontends, Module Federation, and other modern tools!

About The Hackathon

This hackathon, hosted by Shashi Lo’s Gridiron Survivor apprenticeship program, brings together developers for a fast-paced challenge: building an AI-powered travel app entirely from scratch. Taking place in the first quarter of 2026, two rival teams are competing, with each group working on their own unique project. The event offers not only prizes, but also a great opportunity to build skills, collaborate in a real-world setting, and share progress with the community. While there’s a competitive edge, the main focus is on learning, teamwork, and gaining hands-on development experience.

To follow our journey, ask questions, and share your feedback in real time, subscribe to the Coding with Shashi YouTube channel and turn on notifications to stay updated on all the latest events.

Hackathon/Gridiron Survivor Team Members:

What Are Micro-Frontends

Micro-frontends are a way of building a large website by breaking it into smaller, independent sections—each one like its own mini-app, often managed by different teams. Instead of everyone working in one giant codebase, each section focuses on a specific feature, such as search, a shopping cart, or your profile. Teams can build, update, and deploy their own part without waiting for everyone else, using the tools and frameworks they prefer. When you visit the site, a main app brings all these pieces together, so everything feels like one smooth, unified website.

Why Use Micro-Frontends

Why use micro-frontends? As websites grow more complex, it becomes harder for teams to work together in the same codebase without things getting overwhelming. Micro-frontends make it easy to split up the work so teams can focus on just their part of the site. This means updates and new features can go live faster, since teams aren’t waiting on each other. It’s also easier to find and fix problems because everything is broken down into smaller, more manageable pieces. Plus, teams get the freedom to choose the best tools for their section, making everyone’s job simpler and more enjoyable. In the end, micro-frontends help teams move quickly, stay organized, and keep big websites running smoothly.

What Is Module Federation

Module Federation is a tool that lets different parts of a website—like micro-frontends—share code and features with each other, even if they’re built and deployed separately. Think of it like connecting LEGO sets: each team can build their own section of the site, but Module Federation makes it possible to snap those pieces together and even share special bricks (like buttons or menus) without having to copy them everywhere.

With Module Federation, teams can update or add features to their section without affecting the rest of the site. It also means they can use the same tools or libraries just once, instead of loading multiple copies—keeping things fast and efficient. For micro-frontends, this is a game-changer: it allows true independence for teams, while still making sure everything works together smoothly for users. In short, Module Federation is the magic that helps all the mini-apps "talk" to each other and play nicely as one big app.

Personal Reflection

Micro-frontends and Module Federation work together to let teams build complex apps in a smarter, more flexible way. For our hackathon project, this meant we could split our travel app into separate sections—each with its own team and features—while still keeping everything connected. Module Federation was the glue that let us share code and release updates independently, without breaking the rest of the app.

Getting hands-on with these tools during the hackathon showed me just how practical and powerful this approach is. Here’s what I discovered:

At first, I did not grasp the concept or understand the benefits of a micro-frontend—it just sounded like standard React to me, where components can be worked on separately by team members. The “Team Champs” divided their TripWeave app into three parts: Pre-Trip, Itinerary, and During Trip, and each part is set up as a micro-frontend.

With this micro-frontend approach, each part of the app can be worked on independently, without launching the entire app. This allows for a streamlined development process that benefits the team as a whole. For example, the “During Trip” part of the app—an AI-powered travel assistant—is being worked on independently and can even be launched on its own, without having to launch the entire app.

Micro-frontends also let teams share things like components or helper functions, so you don’t have to copy and paste the same code everywhere. This helps keep things simple and follows the “Don’t Repeat Yourself” (DRY) principle. The Module Federation tool works alongside micro-frontends to make this kind of sharing possible, so teams can work independently and still use each other's code when needed.

Here are a few more things I learned along the way:

Incremental Adoption: You don’t have to switch to micro-frontends all at once—just add them piece by piece.
Independent Releases: Teams can deploy updates to their micro-frontend whenever they’re ready, without waiting for the entire app to be finished.
Consistent User Experience: It’s important for the entire team to work together on things like design and navigation, so the app still feels seamless for users, even though different teams built different parts.

Overall, learning about micro-frontends opened my eyes to new ways teams can build better apps together. This was my first experience working with micro-frontends, and although it was admittedly a bit challenging to grasp and set up, I now see the value and benefits they bring to team-based projects.

Team Champs TripWeave app in progress

How We Use Micro-Frontends in the Hackathon

For the Trip-Weave hackathon project, as previously mentioned, one team of 10 members took on the challenge of building the app. This team was further divided into smaller groups, with each group responsible for one section: Pre-Trip, Itinerary, or During Trip (with a few senior members supporting all three micro-frontends). This setup made it much easier for the groups to build, test, and update their section independently, without worrying about breaking the rest of the app.

To organize and connect all the pieces, the team used a tool called Rsbuild. Rsbuild is a super-fast build tool—think of it as a high-speed publisher for your app—that turns code into something the browser can use. Each micro-frontend had its own setup, so groups could work independently and development was much faster. The main app, called the "shell," could then pull in each micro-frontend on demand, similar to plugging in different game cartridges. Rsbuild was chosen because it's fast, supports sharing key libraries like React as singletons (so only one copy runs at a time), and works well with the team's deployment setup.

To help everything work smoothly together, Module Federation was also used. This allowed the team to share code and features between sections, so there was no need to copy and paste the same things everywhere. Zephyr (one of this Hackathon’s sponsors) was also brought in to help automatically check and share code safely between the groups, making collaboration even easier. Zephyr is a platform and set of tools that helps deploy, manage, and connect micro-frontends in the cloud. It also helps generate TypeScript types for shared code, making sure everything fits together and reducing mistakes. In addition, Zephyr was used to deploy the app to the cloud, streamlining the launch process for the entire team.

Gridiron Survivor Hackathon & Zephyr Cloud

This video introduces the Gridiron Survivor’s Hackathon, sponsored by Zephyr Cloud, with a focus on AI and building specialized agents. Zach Chapel, CEO and co-founder of Zephyr Cloud, discusses the launch of Zephyr Agency—a platform designed to create powerful, purpose-driven AI agents that go beyond generic tools.

Highlights from the video:

Specialized AI Agents: The benefits of building agents with specific skills and human-like attributes, making them more effective than generalist AIs.
Hackathon Project Ideas: Potential projects include travel agents or websites using these specialized agents to provide tailored experiences.
Micro-Frontends & Module Federation: How breaking apps into smaller, independent pieces lets teams work faster and deliver a seamless user experience. Zephyr Cloud streamlines this process with efficient deployment tools.
Junior Developers & AI: The value of junior developers who are eager to learn and adopt new AI technologies, often adapting faster than more experienced developers.

Watch the video to learn more about how AI and modern web development tools are shaping the future of collaborative projects!

Further Learning

For an in-depth dive into Micro-Frontends, check out Jack Herrington’s excellent freeCodeCamp YouTube course: Micro Frontends Course – Beginner to Expert

This course covers foundational concepts and advanced techniques, making it a great resource for both beginners and experienced devs!

Gridiron Survivor Sponsors

A very special thanks to our sponsors!

GitKraken: A popular Git client that provides a graphical interface to manage Git repositories. It is known for its user-friendly design and features that simplify version control, making it easier for developers to collaborate and manage their code.
Frontend Mentor: An online platform that offers front-end coding challenges. It helps developers improve their skills by providing real-world projects to work on and a supportive community for feedback and learning.
Zephyr Cloud: A Module Federation platform that accelerates micro-frontend development by providing instant deployment, intelligent dependency resolution, and seamless version management—all while remaining cloud agnostic, framework agnostic, and bundler agnostic.

My other related articles

Be sure to listen to the HTML All The Things Podcast!

**📝 I also write articles for the HTML All The Things Podcast, which you can read on their website: https://www.htmlallthethings.com/**.

Be sure to check out HTML All The Things on socials!

I’m excited to announce that I’m now a Torc Ambassador! As part of this global community, I’ll be sharing valuable insights from Torc’s virtual events, lessons from my own tech journey, and real-world perspectives on how teams are hiring and working today. I’ll be active in the Torc community through posts, events, Q&A sessions, and more—so stay tuned for updates and opportunities to connect. Whether you’re looking to advance your tech career or simply stay informed, I hope the insights I share will support and inspire you on your journey!

Torc is an AI-powered platform and vibrant global network that connects skilled professionals with top opportunities and forward-thinking companies. If you’re interested in joining, you can create a free profile using my referral link: https://platform.torc.dev/#/r/b5QZ7k5h/cp

Affiliate & Discount Links!

With CodeMonkey, learning can be all fun and games! CodeMonkey transforms education into an engaging experience, enabling children to evolve from tech consumers to creators. Use CodeMonkey's FREE trial to unlock the incredible potential of young tech creators!

With a structured learning path tailored for various age groups, kids progress from block coding to more advanced topics like data science and artificial intelligence, using languages such as CoffeeScript and Python. The platform includes features for parents and teachers to track progress, making integrating coding into home and classroom settings easy.

Through fun games, hands-on projects, and community interaction, CodeMonkey helps young learners build teamwork skills and receive recognition for their achievements. It fosters a love for coding and prepares children for future career opportunities in an ever-evolving tech landscape.

To learn more about CodeMonkey, you can read my detailed review article!

Affiliate Links:

Advance your career with a 20% discount on Scrimba Pro using this affiliate link!

Become a hireable developer with Scrimba Pro! Discover a world of coding knowledge with full access to all courses, hands-on projects, and a vibrant community. You can read my article to learn more about my exceptional experiences with Scrimba and how it helps many become confident, well-prepared web developers!

Important: This discount is for new accounts only. If a higher discount is currently available, it will be applied automatically.

How to Claim Your Discount:

Click the link to explore the new Scrimba 2.0.
Create a new account.
Upgrade to Pro; the 20% discount will automatically apply.

Disclosure: This article contains affiliate links. I will earn a commission from any purchases made through these links at no extra cost to you. Your support helps me continue creating valuable content. Thank you!

Conclusion

Instead of building one giant website, micro-frontends let teams split the project into smaller, independent sections, almost like mini-apps. Each team can focus on specific features and work in parallel. This approach makes big projects easier to manage, speeds up updates, and helps teams avoid stepping on each other’s toes. It also allows for more flexibility and a smoother user experience.

Module Federation is the secret sauce that lets these separate parts share code and work together seamlessly, even if they’re built and deployed independently.

Working hands-on with micro-frontends and Module Federation during the hackathon changed the way I think about building apps. I saw firsthand how these tools help teams collaborate, experiment, and release updates faster, all while keeping everything organized and connected. Whether you’re building a big project with a team or just curious about new ways to structure your apps, these tools are definitely worth a look!

Let’s connect! I’m active on LinkedIn and Twitter.

Are you now curious about building apps with micro-frontends and Module Federation? Are you considering using these tools in your next project? Please share the article and comment!

Hackathon Highlights: Building and Livestreaming an AI Travel Agent

Michael J. Larocca — Mon, 12 Jan 2026 19:33:46 +0000

In this week's article, we dive into a sponsored hackathon where we build an AI-powered travel agent app—competing, collaborating, livestreaming, and more! Follow along to learn real-world dev skills!

Hackathon AI Agent Challenge

To kick off 2026 and continue my self-taught developer journey, I’m once again joining Shashi Lo’s Gridiron Survivor team—an apprenticeship program that gives devs hands-on, pro-level experience. This time, we're taking on a hackathon challenge to build an AI agent!

The hackathon features two rival teams competing to develop an AI-powered travel agent app, sponsored by GitKraken, Frontend Mentor, and Zephyr Cloud. Up for grabs: a $1000 cash prize, one-year free memberships, and plenty of swag! This hackathon is underway now and will continue into February (and may extend if additional time is needed).

While it’s a contest, the real win for everyone is the shared learning experience, the sense of team camaraderie, and—my favorite—the chance to keep building an online presence.

On a personal note, I’m especially excited for this hackathon because my nephew David Terzano—fresh out of college with a degree in computer science and a passion for game development—is joining my team! This event gives David and all participants real-world team experience to help close the gap that new devs face when seeking their first roles. I can’t wait to see him jump in, learn with us, and bring fresh ideas to the project!

AI Agent, Travel Agent

The challenge is to build a travel agent app powered by a specialized AI agent that serves as the core of our hackathon project. A successful AI travel agent should efficiently integrate with multiple APIs to provide accurate travel information, automatically suggest itineraries, and personalize travel plans based on user preferences. Our desired outcome includes robust handling of user queries and consistent performance under various use-case scenarios.

Speed: Each team chooses its own tech stack, which enables efficient development and performance optimization to meet specific project demands.
Flexibility: Micro front-end architecture enables modular development, making it easier to update sections of the app independently.
Integration: API integrations are key to the app pulling real-time travel data and resources, ensuring accurate, timely information.
Intelligence: Custom AI models are used to analyze user data and preferences, providing personalized travel suggestions and enhancing the user’s experience.

These features and more highlight the complexity and potential of our AI travel agent app!

Livestream Presentations

To truly level up like the pros, team members will be hosting live presentations. Taking the floor to present, demo, and field questions is a valuable skill in itself, especially when navigating inevitable technical difficulties.

As a first step to engage with our journey, subscribe to the Coding with Shashi YouTube channel and turn on notifications to stay updated on all events. This ensures you won't miss any opportunities to follow along, ask questions, and provide feedback live.

Sharing Our Learnings

In upcoming articles, I’ll take you behind the scenes of this hackathon, sharing our process, challenges, and key takeaways. You’ll be able to follow our journey step by step—from the initial setup and development to our results and lessons learned. Beyond building an AI agent, there’s a lot happening under the hood, and I can’t wait to cover it all!

Gridiron Survivor Sponsors

A very special thanks to our sponsors!

GitKraken: A popular Git client that provides a graphical interface to manage Git repositories. It is known for its user-friendly design and features that simplify version control, making it easier for developers to collaborate and manage their code.
Frontend Mentor: An online platform that offers front-end coding challenges. It helps developers improve their skills by providing real-world projects to work on and a supportive community for feedback and learning.
Zephyr Cloud: A Module Federation platform that accelerates micro-frontend development by providing instant deployment, intelligent dependency resolution, and seamless version management—all while remaining cloud agnostic, framework agnostic, and bundler agnostic.

My Other Related Articles

Be sure to listen to the HTML All The Things Podcast!

**📝 I also write articles for the HTML All The Things Podcast, which you can read on their website: https://www.htmlallthethings.com/**.

Be sure to check out HTML All The Things on socials!

Affiliate & Discount Links!

To learn more about CodeMonkey, you can read my detailed review article!

Affiliate Links:

Advance your career with a 20% discount on Scrimba Pro using this affiliate link!

Important: This discount is for new accounts only. If a higher discount is currently available, it will be applied automatically.

How to Claim Your Discount:

Click the link to explore the new Scrimba 2.0.
Create a new account.
Upgrade to Pro; the 20% discount will automatically apply.

Disclosure: This article contains affiliate links. I will earn a commission from any purchases made through these links at no extra cost to you. Your support helps me continue creating valuable content. Thank you!

Conclusion

A hackathon is a fantastic way to learn web development and build real team experience. This challenge lets us work with cutting-edge technologies and showcase how an AI agent is built from the ground up. Whether you’re a participant or following along, you’ll see how competition, collaboration, and livestreaming all come together—plus pick up valuable, in-demand skills!

We’ll take you behind the scenes as we choose our tech stack, tackle real-world problems, and share the tools and approaches we use. Watch our livestreams to see the action unfold, and join the conversation to connect, ask questions, and get involved. You’ll find inspiration, insights, and practical tips for your own projects.

Curious how it all comes together in real time? Follow our journey for updates, lessons learned, and strategies you can put to use in your own projects—so you gain real value as we build and learn together!

Let’s connect! I’m active on LinkedIn and Twitter.

Are you excited to follow our hackathon journey and learn how to build an AI agent? Do you have your own tips or stories from hackathons? Please share the article and comment!

Experience Matters: Job Search Tips and Strategies for Overcoming Ageism

Michael J. Larocca — Wed, 17 Dec 2025 19:44:55 +0000

Struggling with age bias in your job hunt? Jessica Hernandez shares resume and job-search optimization tips to help experienced professionals stand out, get more callbacks, and land more interviews!

Discovering Strategies to Overcome Ageism

I recently had the pleasure of attending an insightful LinkedIn Live event hosted by career coach Jessica Hernandez that addressed the important issue of avoiding ageism in a job search.

Jessica shared practical resume strategies and actionable job search guidance tailored for older professionals in the replayable session.

Since I just entered my 50s and am interested in a career change into the tech industry, this event piqued my interest, and I must say, in a short 30-minute presentation, there was a lot of valuable optimization advice and tips that can really give older job seekers a competitive advantage, further assisting in securing a new job. After the presentation, Jessica took extra time to answer questions and offer further support to attendees, so it's worth watching.

If you’re an older job seeker, applying these resume and job search strategies can help you shift the focus to your true strengths, while eliminating age-related red flags. Applying these strategies can result in a noticeable increase in callbacks and job opportunities!

What is Ageism

I’ll be bold enough to call it the way I personally see it: ageism is discrimination. The more socially acceptable definition is “treating someone unfairly because of their age.” Define it as you will, ageism often leads to missed opportunities, biased hiring decisions, and unjust assumptions about a person’s abilities.

To underscore the impact of ageism in the job market, Jessica notes that researchers sent out thousands of identical resumes with the same skills, experience, and qualifications. The only difference: half of the resumes included dates signalling the candidates were older, while the other half suggested younger applicants. The results were striking. Applicants aged 40–49 had a 38% lower callback rate, and those aged 50+ had a 62% lower rate. In other words, even highly qualified older job seekers received fewer callbacks simply because of age-related signals on their resumes.

Jessica points out that ageism remains one of the most widely accepted and least legally protected forms of discrimination in the workplace. While statistics may fluctuate over time, age bias is here to stay, continually affecting older job seekers. That’s why the strategies and tips provided here will continue to be relevant.

Making Your Resume and Job Search Work for You

The goal isn’t to hide your age, but to showcase the impact, value, and experience you offer, while removing unnecessary “age-related signals.” With a few simple updates to your resume and job search strategy (which we’ll cover next), you can unlock more opportunities!

Resume Tips

Before you start applying, it’s important to make sure your resume is truly working for you. The tips in the following section will help you refresh your resume, avoid common age-related signals, and present your experience in the best possible light, increasing your chances of landing interviews.

Trim your timeline

When listing your job experience, focus on the most recent 10 to 15 years, since these roles are typically the most relevant to your current job search. If you want to highlight/showcase earlier positions, you can create a separate 'Earlier Career Experience' section; just be sure to skip the dates and emphasize achievements rather than job titles alone. Summarize your impact in each role, and remember to omit specific years (like 1990 to 1995).

Lead with Your Value

Don’t start your resume summary with the number of years you’ve worked (e.g., “25 years of experience”), as this can draw attention to your age. Instead, lead with your value: focus on who you are and what you deliver right now. For example: “Operations Director who cuts costs by x% and increases delivery speed by x%.” This simple shift changes the narrative from your age to your strengths, accomplishments, and results.

Modernize Your Education

Remove specific dates from your education section; just list your degree and school (e.g., Bachelor of Arts in English, George Washington University). The exception is if you’ve recently earned a credential that’s directly relevant to your current job search; in that case, you can include the date, as it can work in your favor.

Remove Outdated Technology

If you’ve been working at a company for a long time using outdated technology, remove it from your resume.

I can personally relate to this, as I’ve been extensively utilizing Microsoft VBA (Visual Basic for Applications) at my current company for over 20 years. Although the custom software I created remains in active use today, VBA is increasingly viewed as a legacy technology.

Once you’ve removed outdated technology from your resume, be sure to add current tools and skills you use. Jessica notes that including AI skills can increase your callback and interview rates by over 30%, since AI is highly sought after by employers.

Update Resume Fonts

Refrain from using fonts that have been around for an exceptionally long time, such as Times New Roman and Garamond. These fonts can make your resume look dated and may give the impression that your skills or experience are outdated as well. Instead, choose a modern, easy-to-read font like Calibri, Arial, or Helvetica to help your resume stand out and look current and professional.

Remove Outdated Email Addresses

Another helpful tip is to update any outdated email addresses, like AOL or Hotmail, since these can send age signals to employers. Switching to a newer address, such as Gmail or Outlook, helps your resume look more current. Plus, creating a separate email just for your job search can make it easier to keep track of applications and responses.

Additional tip: Remove the parentheses from your phone number, which were introduced with early area codes and can be a subtle age giveaway. Just use dashes and drop the one as follows: 555-123-4567.

Job Search Strategies

Once you’ve revised your resume to remove unnecessary age-related signal flags, the next step is to approach your job search strategically. The tips in the following section will help you identify companies that value your experience, make the most of your broader network, and confidently address any age-related concerns, increasing your chances of finding the right fit and landing your next role.

Target Companies That Value Your Experience

Jessica advises seeking employment with companies that value your years of experience as an asset, rather than those that see them as a liability.

In the current job market, Fortune 500 companies, including FAANG (Facebook, Apple, Amazon, Netflix, Google), are downsizing, leading to mass layoffs. However, small companies (1,000 employees or fewer) are increasing their hiring. So, targeting smaller companies, such as tech startups, can increase your chances of being hired.

Jessica also notes that small companies often value older, experienced employees because they can get up to speed quickly, provide valuable insights, and help train younger staff, all in a cost-efficient manner.

Another tip is to research companies to see if they have a diverse staff, including older workers in leadership positions. This can be a good sign that the company values experience and could be a great fit for you.

Use Your Non-Professional Network

In addition to your professional network, use your non-professional network (personal friends/contacts) when job-seeking. Jessica refers to these people as “natural connectors,“ preferably on the extrovert spectrum, who can help spread the word about your search and connect you with people who can help you get hired. These people can include outgoing friends, church acquaintances, fellow parents from school clubs, or even local workers at places you frequent, like coffee shops.

The goal is to have people mention your name in rooms where you aren’t present, which can organically increase your job opportunities. Jessica recalls a personal win with this tactic when her husband acted as a natural connector, securing her a job offer and bypassing the entire interview process. It’s a great example of how natural connectors can help speed up the hiring process!

Ageism Myth Busters

Jessica advises you to address any potential objections employers might have before they even arise, whether in your cover letter or during an interview. By doing this proactively, you increase your chances of moving forward in the hiring process.

Potential age-related objections may include:

You’re overqualified.
We are looking for someone more junior.
We’re not sure you would be a good culture fit
We’re worried you would be bored in this role.
Older workers are incapable or unwilling to learn new technologies

You can combat age-related objections by preparing a counterargument for each potential concern and tailoring your responses to your personal situation, since these will vary for each job seeker. Make sure your answers are authentic and reflect your true experiences.

Jessica provides the following possible counterarguments for demonstration. For “you’re overqualified,” you might detail that you’re at a stage in your life where your work/life balance and contributing to a stable company matter more than career advancement. You want to use your expertise to help the company achieve its goals while mentoring the next generation. You can also offer somthing like “I know you might be wondering if someone with my experience would be satisfied here. Let me share why this role is exactly what I’m looking for.” Then, list several reasons why that role is what you are looking for.

Further tips Jessica provides: If you are making a downshift in you carreer, be ready to articulate why. If you are close to retirement age, you can talk about your 5 to 10-year vision, which shows you plan to continue working. You can share specific job role aspects that excite you, talk about how you will contribute without overstepping, your commitment to the role ( you don’t view the role as a stepping stone ), and you look forward to staying there, as opposed to working somewhere else.

Finally, it’s time to challenge the outdated belief that older workers can’t or won’t learn new technologies. Jessica suggests highlighting specific ways you’ve embraced and adapted to new technologies, such as:

Recent certifications: List any up-to-date certifications or courses you’ve completed to show your commitment to ongoing learning.
Tools you’ve mastered: Mention new software, platforms, or technical tools you’ve become proficient with, demonstrating your ability to adapt.
How you implemented new systems: Share examples of times you introduced or helped your team adopt new technologies, processes, or systems at work.

I’ll conclude by sharing my advice as a self-taught web developer transitioning into tech: don’t be stubborn!

Although past technologies may have served you well, new technologies will continue to emerge in the future. To stay relevant, you must have a growth mindset and continually adapt.

Continue to build and share projects in public that utilize new technologies you are learning and using, as this showcases your skills, provides examples of your work, and is proof of your passion and your willingness to learn, all qualities that hiring managers highly value!

About Jessica Hernandez

Jessica Hernandez is the founder and CEO of Great Resumes Fast, an executive resume writing service she launched in 2008 after more than a decade directing hiring practices at Fortune 500 companies. As an 8X-certified career coach and executive resume writer, Jessica is recognized globally as a resume expert and was named a LinkedIn Top Voice in 2020. Her insights have been featured in major outlets, including Forbes, Fast Company, and Fortune, and her personal approach helps hundreds of clients each year stand out in the job market.

Links

🔗 Website

🔗 LinkedIn

🔗 Instagram

🔗 X (Twitter)

🔗 Pinterest

🔗 Facebook

Ready to take your job search to the next level? Explore Jessica Hernandez’s website, Great Resumes Fast, for personalized services, including resume rewrites, full personal brand makeovers, executive alignment packages, expert resume reviews, and FREE downloadable PDFs to support your career journey. Check out all services and resources today!

My other related articles

Be sure to listen to the HTML All The Things Podcast!

**📝 I also write articles for the HTML All The Things Podcast, which you can read on their website: https://www.htmlallthethings.com/**.

Be sure to check out HTML All The Things on socials!

Affiliate & Discount Links!

To learn more about CodeMonkey, you can read my detailed review article!

Affiliate Links:

Advance your career with a 20% discount on Scrimba Pro using this affiliate link!

Important: This discount is for new accounts only. If a higher discount is currently available, it will be applied automatically.

How to Claim Your Discount:

Click the link to explore the new Scrimba 2.0.
Create a new account.
Upgrade to Pro; the 20% discount will automatically apply.

Disclosure: This article contains affiliate links. I will earn a commission from any purchases made through these links at no extra cost to you. Your support helps me continue creating valuable content. Thank you!

Conclusion

Ageism is discrimination against older workers, and it can present unexpected challenges for job seekers. These challenges often include unintentionally leaving age-related signals on your resume, which can reveal your age and lead to fewer callbacks and interviews, even when you’re just as qualified as younger candidates. Without a strategy to overcome ageism, you may encounter even more obstacles along the way.

There’s nothing wrong with being an older job seeker; you should be proud of your expertise and achievements! The goal isn’t to hide your age, but to focus on your strengths and highlight the impact and value your experience brings.

You can draw attention away from your age on your resume by removing unnecessary age signals. This includes listing only your most recent 10 to 15 years of job experience, leaving out graduation dates from earlier than that timeframe, and omitting outdated technologies. Use a modern, streamlined format and emphasize current skills, certifications, and accomplishments that demonstrate your ongoing growth and adaptability.

When searching for your next role, target companies that value experience, such as smaller organizations or those with diverse leadership. Don’t limit yourself to your professional network; tap into personal connections as well, such as friends, community members, and acquaintances who can serve as powerful connectors. Proactively address potential age-related concerns in your applications and interviews with thoughtful, authentic responses. Show your adaptability by highlighting recent certifications, new tools you’ve mastered, and public projects that reflect your commitment to learning and growth. Consistently building and sharing your work publicly not only highlights your skills but also proves your passion and adaptability to employers.

Remember, there’s more to a successful job search than just combating ageism with resume tweaks and strategies. If you’re ready to take the next step, explore Jessica Hernandez’s website, Great Resumes Fast, for personalized support. Whether you need a resume rewrite, a full personal brand makeover, executive alignment packages, expert resume reviews, or FREE downloadable resources, you’ll find everything you need to advance your career. Check out all the services and tools available to help you land your next role with confidence!

Let’s connect! I’m active on LinkedIn and Twitter.

Are you now confident in overcoming ageism in your job search? Do you have additional strategies to share for experienced professionals? Please share the article and comment!

Navigating Your Tech Career: Proven Strategies for Success

Michael J. Larocca — Mon, 01 Dec 2025 17:29:15 +0000

Introduction

In this insightful article, Torc’s VP of Global Community, Taylor Desseyn, shares his wealth of knowledge on navigating the ever-evolving tech landscape. Drawing from his extensive experience, Taylor provides practical advice and actionable tactics for thriving in your tech career. This article delves into the importance of leveraging transferable skills, broadening your job search, and effectively utilizing AI in your professional journey. Whether you're just starting out or looking to elevate your career, this guide offers essential strategies to help you excel in the competitive tech industry and secure your ideal role!

Topics covered in this article include:

Utilizing Your Transferable Skills: Leverage your existing skills to gain a competitive edge in tech.
Broadening Your Job Search: Explore diverse opportunities and stay informed about industry trends.
Navigating AI in Tech Careers: Learn how to effectively integrate AI into your work to enhance productivity.
From Layoff to Rehire: Strategies for bouncing back and securing new opportunities after a layoff.
Building Your Network: Expand your professional connections to uncover hidden job opportunities.
Financial Preparedness: Plan for financial stability during career transitions.

Article Concept Overview

Problem:

Navigating the tech industry can be daunting, especially with the rapid pace of change and the increasing reliance on AI. Professionals often struggle with job security, adapting to new technologies, and effectively utilizing their existing skills to stay competitive. The challenge lies in broadening job searches, leveraging transferable skills, and integrating AI into their careers without becoming overly reliant on it.

Solution:

This article offers practical advice from community leader Taylor Desseyn, providing strategies to thrive in the tech landscape. It emphasizes leveraging transferable skills, expanding job searches, and effectively using AI to enhance productivity. Additionally, it covers strategies for recovering from layoffs, building a strong professional network, and ensuring financial preparedness during career transitions. These insights are designed to help tech professionals excel and secure their ideal roles in a competitive industry.

Job Security Insecurity

The days of working for one company for 30-plus years and retiring, for the most part, seem to be behind us; we all feel an unsettling insecurity about job security. So, it is more important than ever to have plans in place to help you navigate your career throughout the years! Taylor Desseyn has been on the front lines from before the pandemic to after the rise of AI, and is here to share actionable tactics YOU can use to thrive throughout your career!

Utilize Your Transferable Skills

Taylor states that a key factor for success in landing a developer job is pursuing programming careers that leverage your transferable skills. Host Matt supports this by recalling his podcast interview with Scrimba founder Per Borgen, where Per confirms that this tactic is successful among many students. Leveraging your non-technical background will help you stand out, and your experience provides valuable skills, making you a strong candidate with unique insights that give you an edge over developers without industry experience.

Taylor leveraged his transferable skills and credits his 11+ years of experience as a traditional recruiter for his transition into his current role at the tech company Torc. His extensive “non-technical” recruitment experience made him a stronger candidate for the VP of Global Community role, outperforming developers who also applied for the same position, which lacked his expertise.

A great tip Taylor recommends is for you to perform a “skillset self-assessment” and target job roles where you can leverage those skills to gain a competitive advantage!

Broaden Your Job Search

In the constantly evolving field of web development, new skills will be necessary to qualify for emerging in-demand job roles. Besides continuous tech learning, Taylor suggests expanding your job search by researching current hiring trends. Focusing your learning on current in-demand skills will better position you to secure those roles.

Here are some additional tips to broaden your job search:

Join online forums and communities related to your field to stay updated on job openings and industry news.
Utilize job search engines and set up alerts for specific roles or companies you are interested in.
Consider remote work opportunities to expand your job search beyond your local area.
Reach out to tech recruiting specialists to gain insights into the job market and potential opportunities.
Leverage LinkedIn to connect with professionals in your industry and follow companies you are interested in to stay informed about job openings.
Attend industry conferences and networking events to learn about emerging trends and connect with potential employers.

Navigating AI in Tech Careers

Unlike other tech trends, the general opinion is that AI is here to stay. While views on AI’s influence in the tech industry differ—some cautiously, others confidently—we will all inevitably have to deal with it one way or another.

Taylor explains that the tech layoffs are mainly due to overhiring during the pandemic, not to AI's impact, as many believe. He does, however, observe that AI used by skilled workers results in smaller teams in the recruitment industry, as it boosts individual performance. I believe this also applies to almost all types of careers, especially in tech. So, teams will naturally shrink, making jobs available to talented individuals who can effectively use AI.

How does one effectively use AI, do you ask? The overall consensus favors those who use AI as a tool to be effective and views those who rely on AI as a crutch as ineffective. So it is in your best interest to have a solid understanding of fundamental programming concepts and to be capable of building projects independently.

Real-World Example: As a personal challenge, I pair-programmed with Hashnode’s AI to build a Star Wars Ahsoka React fan website and documented the entire process in an article series. Throughout the process, I realized that working with AI works best when you ask it to help you with coding 1 level above your current knowledge. Meaning, you have to have a solid understanding of what you are trying to build (ex., a drop-down menu). Once I tried to go beyond my current knowledge, I encountered problems, specifically when attempting to implement React Router, because I had not yet built a multi-page React App.

Here's a quick summary of my findings from my pair programming with AI:

The pros of building with AI

It's like having a personal mentor who never gets tired.
You can build code a step above your current knowledge.
You can ask AI to explain how each line of code works.
You can use AI to add comments explaining how each block of code functions.

The cons of building with AI

It can mislead you.
Provides inconsistent code.
Become overly reliant on it
You have to explain your work every time in a new session (depending on your AI tool).

From Layoff to Rehire

Taylor compares the job search to a marathon; it’s tough, but the only way to get through it is to keep going! He offers the following advice to help you regain momentum and reach the finish line.

Edit Your Resume

When applying for jobs, tailor your resume to the specific job. Read the job description to understand the required skills and experiences, and then adjust your resume to highlight relevant experiences and skills. You can rephrase job titles, emphasize achievements, and include keywords from the job posting. Customizing your resume improves your chances of passing the initial screening.

Be Sure to Follow Up

After the initial contact, reach out again to the people you connected with to follow up. As people are busy, and there will most likely be many other candidates, follow-ups can help you stand out from the crowd and show your dedication, if done correctly, of course. Although you may feel discouraged after several follow-ups, it’s imperative to keep a professional tone! Taking a humble approach will yield better results.

Post Your Progress

Sharing your journey from being laid off to being rehired on social media can benefit you and others in a similar situation. Documenting what’s working and what’s not working not only provides valuable insights to help others, but it also helps let others know you are back on the market for a new job role. This tactic will work even better if you have an extensive network.

Several people in my network achieved success by sharing their journeys, including James Q. Quick, Brian Morrison, Kyle Tryon, and, most recently, Joshua Berrios!

Build Your Network

The larger your network, the better your chances of getting a job! Companies often recruit internally, including through their networks, either before or instead of posting jobs publicly. You can build your network by attending in-person and online events, joining tech communities, and engaging in discussions on platforms like LinkedIn, X, and Discord. Taylor also suggests having daily one-on-one talks, which allow others to get to know you and strengthen your professional relationships, which can lead to opportunities down the road.

DM Managers/Employees

Taylor highlights that using LinkedIn's direct messaging feature to reach company managers and employees is a great way to get your foot in the door at companies you're interested in. Although you may not hear back from most, the contacts you do secure can lead to career-changing opportunities! A friend of Taylor's used this cold messaging strategy to initially ask a manager at Netflix for help with a technical problem he was facing. Several chat sessions, which started with his technical question, eventually led to his friend getting a job at Netflix!

Build Your Financial Cushion

According to Taylor’s observations, it often takes 6 to 9 months (on average) to be rehired after a layoff. Keep this in mind and consider building an emergency fund to strengthen your financial security and prepare for this potentially challenging time.

Empowering Your Tech Career with Torc: Community, Innovation, and Opportunity

To help you accelerate your job search and advance your career, Taylor introduces Torc, a career platform that connects tech professionals with job opportunities, emphasizes community, and provides resources and support to promote career growth and simplify the job search!

Especially during challenging job markets, Taylor believes it's crucial to have someone advocate for you. With thousands of resumes, including those sent by automated systems, for each opening, it becomes very difficult for your application to stand out. Torc is developing innovative strategies to tackle the oversaturated process.

Instead of sending out resumes, Torc shares curated profiles. When you create an account with Torc, you build a user profile. Like LinkedIn, you can write an “About Section” to showcase your skills and experience. You can also highlight your projects, which display your tech stack and abilities.

This new method of submitting profiles instead of resumes offers several benefits. First, the profiles approach addresses the problem of “automated system resumes” by implementing a strict verification process that ensures each Torc profile represents a verified person. This helps companies because they no longer need to sift through resumes to find suitable candidates.

Torc promotes community and offers resources and support for career growth through their Discord events. Weekly sessions feature resume and LinkedIn reviews, the “Laid Off Lounge,” live Q&A, and more! They are also developing a Career Hub that will supply resources to help you further.

Being an active member of the Torc community by consistently participating offers a significant advantage: priority status! Active members receive top consideration when Torc connects with companies that are hiring. This system benefits both the developers in the Torc community and the staff by rewarding active members and streamlining the process of identifying the best candidates for recommendations to the Torc team. Be sure to attend events and engage with the community to enhance your chances of landing your ideal tech job!

The image above shows my Torc profile, where I share my elevator pitch with potential employers.

The image above displays my Torc Projects section, where I showcase my work and the technologies I know and use.

As shown in the image above, you can link your GitHub as I did. Your GitHub stats are visible if you choose to display them, so make sure to keep your GitHub active to impress potential employers!

Taylor’s Links

Taylor’s Link Tree
YouTube
Guidance Counsellor 2.0 podcast (Apple Podcasts | Spotify)
Torc platform
Torc’s Discord

Be sure to listen to the Podcast episode!

🎙 Landing a Developer Job in a Tough Market | w/ Taylor Desseyn (VP at Torc)

Be sure to check out HTML All The Things on socials!

How to support the show

Patreon

Prices are subject to change and are listed in USD

Support the show from as little as ~$1/month
Get a shoutout at the end of the episode (while supplies last) for just ~$3/month
Help support the HTML All The Things Podcast: Click Here

Learn with Scrimba!

Learn to code using Scrimba with their interactive follow-along code editor.

Join their exclusive Discord communities and network to find your first job!

Use our affiliate link for a 10% discount!! (Discount valid until the end of 2025)

Click the link and take a look around at the new Scrimba 2.0!
Make an account
You'll then have the option to upgrade to pro content (and you should see our 10% discount listed!)
Discount is for new accounts only

This article contains affiliate links, which means we may receive a commission on any purchases made through these links at no additional cost to you. This helps support our work and allows us to continue providing valuable content. Thank you for your support!

My other related articles

Conclusion

As it is seldom nowadays to work at one company and retire, to achieve long-term success in a tech career, you need to learn how to navigate the constantly evolving tech landscape. Continuous learning, acquiring new skill sets, and expanding your personal network are essential.

Strategies for creating career opportunities include leveraging your transferable skills. Your specialized experience can give you a competitive advantage by providing the practical knowledge that other tech applications might lack, making you a more qualified candidate. You can also boost your career opportunities by researching current in-demand skills, exploring both local and remote jobs, and learning these technologies to broaden your career prospects further.

When it comes to AI, the consensus is to use it as a tool, not as a crutch. Developers who truly understand fundamental programming principles and concepts will have an advantage over those who rely too heavily on them, achieving better results, while those who don't won’t.

To further boost your tech career prospects, it's essential to refine your job application strategy. Begin by tailoring your resume to highlight relevant skills and experience for each role. Consistent follow-ups with potential employers can show your enthusiasm and dedication. Sharing your job search journey on social media can also boost visibility and attract new opportunities. Building a strong professional network is key; connect with industry peers and reach out directly to managers or employees at companies you’re interested in. Additionally, having a financial cushion provides stability during career changes, allowing you to focus on finding the right opportunity without unnecessary stress.

Finally, consider using Torc! Torc connects tech professionals with job opportunities by focusing on community and career growth resources. They use curated profiles instead of traditional resumes, ensuring each profile is verified and stands out. This approach simplifies hiring for companies and prioritizes active community members, boosting their chances of landing tech roles. Torc also offers events and resources, such as resume reviews and a Career Hub, to help YOU improve your skills and advance your career!

Let's connect! I'm active on LinkedIn and Twitter.

You can read all of my articles on selftaughttxg.com

A Guide to Better Code Organization in JavaScript Through File Separation

Michael J. Larocca — Mon, 17 Nov 2025 21:59:22 +0000

This article explores the fundamental concept of file separation in JavaScript projects, highlighting how organizing code into separate JS files enhances structure, readability, and maintainability!

Code Organization Through File Separation

When learning to code, if you’re like me, your primary focus is getting the code to work. This will likely result in a single, huge JavaScript file by the time you are finished. Once your project works, you may be tempted to leave it as is; why fix it if it’s not broken, right?

When you are ready to take your coding skills to a hireable level, it’s best to learn how to code like a pro! One aspect of professional web development is file separation. File separation involves organizing your code into multiple smaller files, each responsible for a specific part of your project, making it easier to manage, understand, and maintain.

But how exactly do you break down your project into separate files? Let me share with you how I am doing it with my JavaScript Pac-Man game project, with the help of AI!

GitHub Copilot in VS Code

If you're using Visual Studio Code as your code editor, you can enhance it with an AI tool called GitHub Copilot by installing it as an extension. This tool helps you write code more quickly by suggesting lines or blocks of code as you type, enhancing efficiency and reducing errors.

GitHub Copilot also offers an interactive chat feature, GitHub Copilot Chat, which is available to Copilot subscribers. This chat allows you to ask questions, receive real-time explanations, and get help with code review, refactoring, and debugging, all right inside VS Code.

I frequently use GitHub Copilot Chat while coding. It not only assists with code review but also acts as a tireless senior developer you can consult for questions! I’ve benefited from asking Copilot how to reorganize my project like the pros do, and I believe YOU will gain the same benefits while building your projects with the help of AI, too!

Refactoring The Main JS File

As I mentioned earlier, since I was focused on getting my Pac-Man game to work, I ended up with a large main JavaScript file. I successfully separated this large main file into individual files for audio and helper functions; however, most of the game control code still mistakenly resided in my helper file.

I asked GitHub Copilot to review my project and explain how a professional developer would reorganize JavaScript files in a game like mine. I was told that the main JS file should stay in the root of the src folder, and the rest can be split into separate JavaScript files inside a js folder.

In my particular project, I was able to refactor my JavaScript files as follows:

audio.js: Handles all sound and music logic for the game, including loading, playing, stopping, and switching between audio tracks and effects.
game-board.js: Manages the setup, rendering, and state of the game board/grid, including board-specific arrays and functions for creating or resetting the board.
game-state.js: Centralizes the overall game state, such as score, lives, level, and other global variables or functions that track the current status of the game.
ghosts.js: Contains all logic related to ghost characters, including their movement, AI behavior, state management, and collision detection with Pac-Man.
helper-functions.js: Stores pure, stateless utility functions that can be reused throughout the project and are not tied to any specific game feature or module.
pacman.js: Handles all logic specific to Pac-Man, such as movement, state, collision detection, and interactions with other game elements.
screens.js: Manages the display and logic for various game screens, such as the title screen, score screen, and attract mode overlays, as well as related UI effects.
ui.js: Contains general UI logic and DOM queries, including updating on-screen elements, handling theme toggles, and managing non-gameplay user interface interactions.

JS Refactoring Process

I wish I could say that refactoring your main JavaScript file into several separate files is easy, but it can be a challenging task. It is best to approach it by first refactoring the least amount of code, starting with the smallest files. After completing each file refactor, thoroughly test it and make a git commit. This approach allows you to refactor incrementally, providing a save point to revert to if necessary.

Problems I encountered were related to my CSS layouts breaking when I combined UI logic and DOM queries into a single file. Apparently, I mistakenly declared the same variables in different files, which caused duplicate declarations in my new, consolidated UI file. I’m really surprised the code worked as expected before I attempted to separate it! However, my first attempt at fixing my duplicated variables ended up breaking my game's CSS layout. I then used git restore and took my time during the second attempt, testing as I went, to make sure I correctly refactored my code into the new UI JavaScript file.

Benefits of File Separation

Separating files in JavaScript projects offers several key advantages, especially for newer, junior developers. One benefit is that it improves the structure and clarity of your code, making it easier to navigate and understand. This approach also enhances maintainability by allowing you to update or fix specific parts without affecting the entire project. Additionally, it simplifies teamwork because members can work on different files simultaneously, which reduces merge conflicts. Moreover, dividing code into files encourages reuse (DRY: "do not repeat yourself") across your project. Overall, it helps you write cleaner, more organized code and prepares you for larger, professional projects.

Other Ways to Learn about File Separation

So, where else can you learn how to separate your project’s JavaScript files? GitHub Copilot and other AI alternatives include exploring open-source projects, engaging with developer communities, and seeking code reviews from peers or mentors. These practices can offer valuable feedback on file organization and best practices, helping new coders refine their skills and adopt industry standards.

Alongside using AI as a senior engineer coach, I am gaining valuable real-world team experience as part of Microsoft Senior UX Engineer Shashi Lo’s Gridiron Survivor apprenticeship program! This program provides hands-on experience and mentorship, enabling developers to acquire practical skills. It effectively bridges the gap between theory and practice, ensuring developers become proficient in teamwork, Agile practices, version control, code reviews, testing, and client communication, ultimately making it easier for them to secure their first job. As team members of this program are “hired off the team,“ positions open up for new members. Be sure to follow our journey and reach out to Shashi Lo via DM on LinkedIn or X to inquire about joining!

JS Pac-Man Project Links:

🔗 Link to the deployed project

🔗 Link to GitHub

🔗 Link to the sprint board

Note: Since I’m following team development practices and pushing updates to the develop branch, some of the changes I describe in this article may not be live in the deployed version of the game yet.

My other related articles

Be sure to listen to the HTML All The Things Podcast!

📝 I also write articles for the HTML All The Things Podcast, which you can read on their website: https://www.htmlallthethings.com/.

Be sure to check out HTML All The Things on socials!

Affiliate & Discount Links!

To learn more about CodeMonkey, you can read my detailed review article!

Affiliate Links:

Advance your career with a 20% discount on Scrimba Pro using this affiliate link!

Important: This discount is for new accounts only. If a higher discount is currently available, it will be applied automatically.

How to Claim Your Discount:

Click the link to explore the new Scrimba 2.0.
Create a new account.
Upgrade to Pro; the 20% discount will automatically apply.

Disclosure: This article contains affiliate links. I will earn a commission from any purchases made through these links at no extra cost to you. Your support helps me continue creating valuable content. Thank you!

Conclusion

Organizing JavaScript code into separate files improves your project's structure, readability, and maintainability. Mastering this skill is essential for becoming a hireable developer, as it guarantees clean, efficient codebases in professional environments. It also conforms to industry standards, allowing teams to work on different files simultaneously, reducing merge conflicts, and boosting collaboration.

Refactoring a single JavaScript file into separate files can be a challenging task. It is best to start with small refactorings, such as creating separate files for DOM queries and audio files, as I did in my Pac-Man game project. Also, be sure to test and commit your work frequently, so you have points to revert to if problematic issues arise.

A good start for learning how to refactor a main JavaScript file into separate files is with AI assistance. GitHub Copilot Chat, a VS Code extension, can help you analyze your project and provide feedback on how to refactor like a pro! Additionally, you can explore open-source projects, participate in developer communities, and ask for code reviews from peers or mentors to gain valuable insights and feedback on best practices for file organization and refactoring. So don’t hesitate or be shy, give refactoring a try!

Let’s connect! I’m active on LinkedIn and Twitter.

Do you now feel more confident in organizing your JavaScript code through file separation? Have you started implementing these techniques in your own projects? Please share the article and comment!

Git Basics: A Beginner's Guide to Branches

Michael J. Larocca — Tue, 11 Nov 2025 21:48:15 +0000

This article explores Git branches and their role in version control. You'll learn about team practices of creating, merging, and managing branches, gaining essential skills for collaborative projects!

What is Version Control?

Version control is a system that helps track changes to files over time. It allows multiple people to collaborate on a project, keeping a history of modifications, so you can revert to previous versions if needed. This is especially useful in software development, where teams collaborate on code, ensuring everyone is on the same page and changes are managed efficiently.

What are Git Branches?

In the context of version control, Git branches are like separate workspaces within a project. They allow you to work on different features or fixes without affecting the main codebase. Each branch can be developed independently, and once the work is complete, it can be merged back into the main branch. This system enables teams to collaborate efficiently, allowing multiple people to work on different tasks simultaneously without interfering with each other's work.

Merge Develop into the Master Branch

When working alone, you'll likely build your projects directly on the default master (main) branch. Even when you start to create individual branches, they will be made from the master branch and be merged back into it. However, when working on a team project, there is usually a development (develop) branch in addition to the master branch, and it is vital to understand how to work with them.

In my recent experience, when implementing a professional Agile workflow in my personal project, I finally understood the concept of having both a develop and master branch. Now that I was creating individual branches for each of my issues, each time I pushed to the default master branch, a deployment was triggered (though Netlify). So I initially thought, “Why am I bothering to make new branches, since I am not working in isolation?” Then I realized that is precisely what the develop branch is for. The purpose of the develop branch is to serve as an integration branch for features before they are ready for production.

In a team-based environment, once you have finished working on your individual issue branch, push and merge it into the develop branch (not the master branch). When all the individual issue branches are merged into the develop branch, yours and presumably those of fellow team members, it is the “develop branch” that gets merged into the “master branch,” which will then trigger a deployment if configured to do so. The master branch is typically the production-ready branch, which is why merging into it triggers deployment.

By following this workflow, you and other team members can confidently work on your own individual branches, contributing to the project simultaneously. Then, when all of the branches are accepted and merged into the develop branch, the team’s work will be deployed to the project once the develop branch is merged into the master branch.

💡 Note: When working on issue branches, it is essential to follow a team-based Agile workflow, which includes testing and code review to ensure quality before merging them into the develop branch.

Make Your Issue Branch from Develop

As I am sure you know, it's crucial to pull all changes from the remote branches first to ensure all files are updated with the latest versions. If you've been working alone for a long time, it might take some time to get used to pulling changes first.

When working on a team project, you'll need to create branches to address individual issues. Generally, these issue branches are created from the develop branch rather than the master branch. So, be sure that you clarify with your team which branch to use as the base for your issue branches.

💡 Note: To maintain consistency and avoid conflicts, it's essential to pull changes from both the master and develop branches regularly. This practice ensures that your branch is synchronized with the latest updates from the main codebase and the develop branch. By doing so, you minimize the risk of merge conflicts and ensure a smoother integration process when your work is ready to be merged back into the main branches.

Agile Development

Having covered the overall concept of working with branches, it's important to note that there are specific conventions and workflows for creating them. These conventions are often guided by Agile development principles, which emphasize flexibility, collaboration, and iterative progress in software projects —principles that my team follows.

Members of the Gridiron Survivor apprenticeship program, of which I am a part, work on individual issue branches of our current project, Elfgorithm, a Secret Santa-style gift exchange app. We use naming conventions for the branches and organize our work into Sprints, which are time-boxed periods during which specific tasks or features are developed. Each individual issue branch undergoes review and testing to ensure quality and functionality.

The naming conventions we use for branches include the programmer’s name, issue number, type (the kind of work), and a short description of the branch’s purpose:

[YourName]/[IssueNumber]-[type]-[IssueDescription]

Using naming conventions for branches enhances project organization and efficiency, allowing branches to be quickly identified and facilitating collaboration.

These conventions also improve Git automation. Scripts can recognize branch patterns to trigger actions, such as tests or notifications, resulting in reduced manual effort and ensuring consistency. Linking Sprint ticket numbers to issue branches connects the code to project management tools, simplifying progress tracking and aligning work with tasks.

Overall, structured naming conventions improve organization, communication, and workflow efficiency in software development.

Deleting with an Individual Issue Branch

Once your individual issue branch is accepted and merged into the develop, it is then safe to delete it. GitHub provides a “Delete Branch“ button for easy removal on the remote repository. You will also need to delete your issue branch in your local repository.

Once your issue branch is deleted from both the remote and local repositories, remember to pull the changes from the master and the newly merged develop branch. This ensures your local repository is up-to-date with the latest changes. Afterward, you can use git fetch --prune to clean up your local repository by removing any remote-tracking references that no longer exist on the remote.

Merge Conflicts

Dealing with merge conflicts deserves its own article, but it’s important to understand, so I will provide a brief overview.

A merge conflict occurs when Git is unable to resolve differences in code between two branches automatically. This typically happens when two team members make changes to the same part of a file. For example, imagine two team members both update the README file and change the same line. Git doesn't know which change to keep, so it flags this as a conflict.

To fix a merge conflict, you'll need to manually review the conflicting changes and decide which version to keep. Here's a simple way to handle it:

Identify the Conflict: When you try to merge, Git will notify you of the conflict and mark the conflicting areas in the file. You'll see markers like <<<<<<<, =======, and >>>>>>> indicating the different changes.
Resolve the Conflict: Open the file in a text editor and look for these markers. Decide which changes to keep or if you need to combine them. Remove the markers and ensure the file appears as you want it to.
Mark as Resolved: Once you've resolved the conflict, save the file and use git add <file> to mark it as resolved.
Complete the Merge: Finally, commit the changes with git commit to complete the merge process.

By understanding and resolving merge conflicts, you ensure that your team's work is integrated smoothly and accurately!

About Us

What is Gridiron Survivor?

Gridiron Survivor is an apprenticeship program created by Shashi Lo, a Senior UX Engineer at Microsoft. It aims to provide developers entering the tech industry with vital work experience. The program focuses on practical training in project management, coding practices, and team collaboration, offering mentorship and skills essential for success in their initial tech roles.

What is the Elfgorithm App?

Elfgorithm is an AI-driven Secret Santa app set to launch in winter 2025. It streamlines gift exchanges by removing the guesswork from Secret Santa activities. The app manages gift-giving details and provides personalized gift suggestions, ensuring you find the perfect presents for everyone.

Gridiron Survivor Sponsors

A very special thanks to our sponsors!

GitKraken: A popular Git client that provides a graphical interface to manage Git repositories. It is known for its user-friendly design and features that simplify version control, making it easier for developers to collaborate and manage their code.
Frontend Mentor: An online platform that offers front-end coding challenges. It helps developers improve their skills by providing real-world projects to work on, along with a supportive community for feedback and learning.
Vercel: A cloud platform for static sites and serverless functions. It is designed to optimize the workflow of developers by providing tools for building, deploying, and scaling modern web applications with ease. Vercel is known for its seamless integration with frameworks like Next.js.

My other related articles

Be sure to listen to the HTML All The Things Podcast!

📝 I also write articles for the HTML All The Things Podcast, which you can read on their website: https://www.htmlallthethings.com/.

Be sure to check out HTML All The Things on socials!

Affiliate & Discount Links!

To learn more about CodeMonkey, you can read my detailed review article!

Affiliate Links:

Advance your career with a 20% discount on Scrimba Pro using this affiliate link!

Important: This discount is for new accounts only. If a higher discount is currently available, it will be applied automatically.

How to Claim Your Discount:

Click the link to explore the new Scrimba 2.0.
Create a new account.
Upgrade to Pro; the 20% discount will automatically apply.

Disclosure: This article contains affiliate links. I will earn a commission from any purchases made through these links at no extra cost to you. Your support helps me continue creating valuable content. Thank you!

Conclusion

Version control is a system that tracks changes to files over time, enabling multiple people to collaborate on a project and revert to previous versions if necessary. In development, branches provide separate workspaces within a project, enabling the independent development of features or fixes without affecting the main codebase. In a team project, there are typically both a development branch and a master branch. The team works on the development branch, which is eventually merged into the master branch.

Individual issue branches are created from the development branch. Once a team member completes an issue branch, it undergoes review and testing as part of Agile development practices before being merged back into the development branch. These issue branches are deleted from both the remote and local repositories after they are merged to maintain a clean codebase.

When working with a team, merge conflicts happen when multiple developers change the same part of a file in different branches. You need to manually resolve these conflicts by reviewing the changes, deciding which ones to keep, and removing the conflict markers. Handling merge conflicts effectively is crucial for maintaining a smooth workflow and ensuring the accurate integration of team members' work.

Practicing is the best way to learn! Even if you're working solo, you can apply Agile workflows to your personal projects by creating, merging, and managing branches. This approach will help you develop marketable skills as you learn and implement Agile workflows!

Let’s connect! I’m active on LinkedIn and Twitter.

Are you now confident in managing Git branches for collaborative projects? Do you have other tips for handling merge conflicts effectively? Please share the article and comment!

Git Basics: A Beginner's Guide to Naming Conventions

Michael J. Larocca — Mon, 03 Nov 2025 18:52:58 +0000

This article discusses Git branch naming conventions, their importance, and how to create clear, organized branches that enhance teamwork and streamline automation in your team's development workflow!

What Are Conventional Branches?

First, let’s clarify what Git is. Git is a version control system that helps developers track changes, collaborate, and manage different versions of their code.

A branch in Git is a separate line of development that allows you to work on new features or fixes without affecting the main codebase.

A conventional branch is a branch naming pattern that follows a specific format, such as feature/login-page or fix/bug-123. Using naming conventions is important, especially for team projects, because it helps everyone understand the purpose of each branch at a glance.

Benefits of Conventional Branches:

Consistency: Ensures all branches follow the same structure, making the project easier to navigate.
Ticket Automation: Allows integration with issue trackers, so branches can be linked to specific tickets automatically.
Changelog Generation: Helps tools generate changelogs by identifying the type of work (feature, fix, etc.) from branch names.
Auto Version Notes: Enables automated release notes by categorizing changes based on branch naming patterns.
Improved Collaboration: Makes it easier for team members to understand the purpose of each branch and coordinate work.
Simplified Code Reviews: Reviewers can quickly identify the context and scope of changes based on branch names.
Reduced Merge Conflicts: Clear branch organization helps prevent overlapping work and reduces the risk of merge conflicts.

Our Team’s Naming Convention

When working with different teams, each will have its own naming conventions, so make sure to learn and follow them. Our team uses a conventional branch name format that includes your name, the issue number, the type, and a brief issue description:

[YourName]/[IssueNumber]-[type]-[IssueDescription]

YourName: The developer’s name or handle.
IssueNumber: The related ticket or issue number.
Type: The kind of work (e.g., feature, fix, test, refactor).
IssueDescription: A short description of the branch’s purpose.

Example:

Here is a branch created by team member Tony to write tests for a “Group Card” component for issue #192:

tony/192-test-groupcard-component

Note: In the screenshot, the extra number (#619) at the end of the commit message indicates the pull request (PR) or merge request number linked to the branch or commit, aiding teams in tracking both the original issue and the PR that fixed it.

Common Type Prefixes

Here are common Git branch prefixes in a bullet point list, along with their meanings:

feat or feature: Used when developing new features or adding new functionality to the project.
bugfix or fix: Used for fixing bugs or resolving issues in the codebase.
hotfix: Reserved for urgent, critical bug fixes that need to be deployed to production immediately.
release: Used when preparing a new production release, allowing for final testing, packaging, and last-minute fixes.
chore: For routine maintenance tasks that don’t affect the source code or tests, such as updating dependencies, build scripts, or configuration files.
docs: For changes to documentation, including updates to README files, wikis, or inline code comments.
refactor: Used when restructuring or cleaning up code without changing its external behavior or adding new features.
test: For adding, updating, or improving tests to ensure code quality and reliability.
style: For changes related to code formatting, whitespace, or style guidelines, without affecting functionality.
perf: Used for changes that improve the performance or efficiency of the codebase.

Version Updates With Conventional Branches

Using conventional branch names makes version updates more organized and transparent. When you follow a naming pattern, tools like GitHub can automatically generate changelogs and release notes based on your merged branches. This helps your team track what was added, fixed, or changed in each version.

Conventional branches also make it easier to link commits to specific issues, ensuring that every update is documented and easy to review during releases!

💡 Pro Tip: Conventional branch naming can also support CI/CD pipelines. For example, automated tests or deployments can be triggered based on branch names, allowing teams to streamline workflows and maintain quality throughout the development process.

About Us

What is Gridiron Survivor?

What is the Elfgorithm App?

Gridiron Survivor Sponsors

A very special thanks to our sponsors!

GitKraken: A popular Git client that provides a graphical interface to manage Git repositories. It is known for its user-friendly design and features that simplify version control, making it easier for developers to collaborate and manage their code.
Frontend Mentor: An online platform that offers front-end coding challenges. It helps developers improve their skills by providing real-world projects to work on, along with a supportive community for feedback and learning.
Vercel: A cloud platform for static sites and serverless functions. It is designed to optimize the workflow of developers by providing tools for building, deploying, and scaling modern web applications with ease. Vercel is known for its seamless integration with frameworks like Next.js.

My other related articles

Be sure to listen to the HTML All The Things Podcast!

📝 I also write articles for the HTML All The Things Podcast, which you can read on their website: https://www.htmlallthethings.com/.

Be sure to check out HTML All The Things on socials!

Affiliate & Discount Links!

To learn more about CodeMonkey, you can read my detailed review article!

Affiliate Links:

Advance your career with a 20% discount on Scrimba Pro using this affiliate link!

Important: This discount is for new accounts only. If a higher discount is currently available, it will be applied automatically.

How to Claim Your Discount:

Click the link to explore the new Scrimba 2.0.
Create a new account.
Upgrade to Pro; the 20% discount will automatically apply.

Disclosure: This article contains affiliate links. I will earn a commission from any purchases made through these links at no extra cost to you. Your support helps me continue creating valuable content. Thank you!

Conclusion

Git is a version control system used by teams to track changes and manage code versions. A branch is a separate development line that each team member creates to add features or fixes without affecting the main code. Following a conventional branch naming pattern is essential when making branches for several reasons.

The benefits of using conventional branches include ensuring consistency across the project, facilitating ticket automation by linking branches to specific issues, and aiding in changelog generation by identifying the type of work from branch names. Additionally, it enables automated release notes, improves collaboration by clarifying the purpose of each branch, simplifies code reviews by providing context, and reduces merge conflicts by organizing branches clearly to prevent overlapping work.

When working with different teams, each will likely have its own naming conventions, so be sure to learn and follow them and help your fellow team members understand them as well. Doing so will establish you as a valuable team player!

Let’s connect! I’m active on LinkedIn and Twitter.

Do you now feel confident in using conventional branch naming patterns in Git? Have you already enhanced your team's workflow with these practices? Please share the article and comment!

Sprint Workflow: A Beginner's Guide to Agile Development

Michael J. Larocca — Mon, 27 Oct 2025 20:07:36 +0000

In this article, we explore the sprint process in software development. You'll learn to manage tasks using a sprint board, track progress, and enhance team efficiency for successful project deliveries!

What Is a Sprint?

A sprint is a short, focused period of work during which a development team tackles specific tasks or goals (for my team, it’s two-week periods). In modern software projects, sprints help teams stay organized, track progress, and deliver updates efficiently.

What is Agile Development

Agile development is a way of building software that focuses on flexibility, teamwork, and continuous improvement. Instead of planning everything up front, teams work in short sprints to deliver small, usable project pieces. After each sprint, the team reviews what went well and what can be improved, making it easier to adapt to changes and deliver better results. Agile helps teams stay organized, respond quickly to feedback, and progress projects.

What is a Sprint Board & Ticket?

I like explaining a ticket by analogy—think of a ticket as an index card pinned to a corkboard (Sprint Board). In the following example, the corkboard has five column headers labeled as follows:

To Do
In Progress
In Review
Testing
Done

The index card lists tasks and moves through each column of the corkboard as the tasks are completed.

To Do	In Progress	In Review	Testing	Done
(TICKET)

To Do

Let’s write two tasks on the imagined index card:

Update the README file to include the new login feature
Add a URL link to the deployed project.

The provided index card (sprint ticket) will have an auto-generated number; let’s say it’s 12.

Now, I will assign YOU to complete ticket number 12. After reviewing the assigned tasks, you will let the team know how long it will take you to complete. This is done using a point system.

A point represents a time variable that can differ among teams. Our team’s point system is as follows:

point-0: within 2 hours
point-1: within 1/2 day
point-3: within 1 day
point-5: within 3 days
point-8: within 1 week

Since this is your first ticket, a full day will be acceptable for the task as you will need time to write documentation for the new login procedure and add a URL to the project. Therefore, you should mark your ticket with 3 points (which represents a day).

In Progress

Once you start working on your assigned ticket, you move it to the “In Progress“ column. When you complete it, you move it to the “In Review“ column and notify your team.

In Review

The review phase of your ticket involves an assigned team member reviewing it to ensure that all of the assigned tasks were completed. In this demonstration, you needed to write documentation in the README file detailing the new login procedure and adding a URL to the project.

⚠ Important: You are NOT to go beyond the tasks on your ticket! For example, you would not add additional information to the README file regarding other aspects of the project. Although your intentions are good, since it goes beyond the scope of the ticket, it will be refused because it will cause confusion and disorganization. Further README file updates should be added to new future tickets.

Testing

Once the ticket passes the review stage, it is moved to testing to ensure the code functions properly; in this simple example, the project link must be clickable and direct to the correct URL. If your ticket passes the testing phase, it is closed and moved to the “Done“ column.

Done

The done column is filled with completed tickets, showcasing all of the project's updates. Great work on completing your ticket and properly maintaining a professional team workflow using a sprint ticket and a sprint board!

Additional Sprint Tasks

Now that we have covered a simple version of a sprint ticket and a sprint board, I can offer you more details of my team’s process.

Additional Sprint Board Columns:

No Status: Tasks or tickets that haven’t been assigned a workflow stage yet.
Back Log: A list of tasks or ideas waiting to be worked on in future sprints.
Epics: Large, high-level tasks or projects broken down into smaller tickets.
Blocked: Tasks that cannot move forward due to an issue or dependency.

Leftover Tickets

What do we do with leftover tickets that weren’t completed during the sprint? They are usually moved back to the backlog or carried over to the next sprint for further work. Reviewing leftover tickets helps the team understand what caused delays and improves future planning, ensuring that important tasks aren’t forgotten.

Team Meetings

Stand-ups: Short daily meetings where team members share progress, plans, and blockers.
Weekly Meetings: Longer meetings held once a week to review progress, plan upcoming work, and discuss any issues.
One-on-one: Private meetings between two team members (often a manager and developer) to discuss individual goals, feedback, or concerns.

Future Sprint Planning

Sprint planning is the meeting where the team decides which tasks or tickets will be tackled in the upcoming sprint. During this session, team members review the backlog, estimate the effort required for each item, and agree on the sprint goals. The result is a clear plan that outlines what will be accomplished and who is responsible for each task, helping everyone stay focused and aligned throughout the sprint.

About Us

What is Gridiron Survivor?

What is the Elfgorithm App?

Gridiron Survivor Sponsors

A very special thanks to our sponsors!

GitKraken: A popular Git client that provides a graphical interface to manage Git repositories. It is known for its user-friendly design and features that simplify version control, making it easier for developers to collaborate and manage their code.
Frontend Mentor: An online platform that offers front-end coding challenges. It helps developers improve their skills by providing real-world projects to work on, along with a supportive community for feedback and learning.
Vercel: A cloud platform for static sites and serverless functions. It is designed to optimize the workflow of developers by providing tools for building, deploying, and scaling modern web applications with ease. Vercel is known for its seamless integration with frameworks like Next.js.

My other related articles

Be sure to listen to the HTML All The Things Podcast!

📝 I also write articles for the HTML All The Things Podcast, which you can read on their website: https://www.htmlallthethings.com/.

Be sure to check out HTML All The Things on socials!

Affiliate & Discount Links!

To learn more about CodeMonkey, you can read my detailed review article!

Affiliate Links:

Advance your career with a 20% discount on Scrimba Pro using this affiliate link!

Important: This discount is for new accounts only. If a higher discount is currently available, it will be applied automatically.

How to Claim Your Discount:

Click the link to explore the new Scrimba 2.0.
Create a new account.
Upgrade to Pro; the 20% discount will automatically apply.

Disclosure: This article contains affiliate links. I will earn a commission from any purchases made through these links at no extra cost to you. Your support helps me continue creating valuable content. Thank you!

Conclusion

A sprint is a short, focused period of work during which a development team completes specific tasks or goals. Sprints are an essential part of Agile development, a method of software creation that stresses flexibility, teamwork, and continuous improvement.

Sprint tasks are tracked using tickets that include detailed instructions. As work progresses, these tickets are moved across titled columns on a Sprint Board—To Do, In Progress, In Review, Testing, and Done, among others. Each ticket is assigned an estimated completion time by the assignee using a point system. Points represent time intervals that can differ between teams, such as point-1 for half a day, point-3 for one day, and point-5 for three days. Leftover tickets that weren’t completed during a sprint are typically moved back to the backlog or carried over to the next sprint for further work.

Regular team meetings keep everyone aligned and productive. Daily stand-ups help share progress and blockers, weekly meetings review progress and plan ahead, and one-on-ones focus on individual goals and feedback. Future sprint planning prepares the team for the next cycle by reviewing the backlog, estimating tasks, and setting clear goals. This ongoing process helps teams stay organized, adaptable, and successful.

Ready to implement Agile? Begin planning your next sprint and discover how this workflow can enhance your team’s productivity and project success!

Let’s connect! I’m active on LinkedIn and Twitter.

Do you now feel confident in managing tasks using a sprint board? Are you ready to enhance your team's efficiency with agile development? Please share the article and comment!

JavaScript Essentials: How to Use .includes() for Array Searches

Michael J. Larocca — Mon, 20 Oct 2025 19:30:38 +0000

In this article, we explore JavaScript's .includes() method for searching arrays, including practical implementations in game development. You'll learn coding techniques to enhance your own projects!

.includes()

What is .includes()? Array.prototype.includes() is a built-in JavaScript array method that checks if an array contains a specific element. It returns true if the element is found, and false otherwise.

Syntax:

element: The value to search for.
f*romIndex (optional)*: The position in the array to start searching.

array.includes(element, fromIndex)

What You Can Do With .includes()

The .includes() method is excellent for checking if an array contains a specific value—it even works with emojis! For a simple demonstration, here’s how I use .includes() in my Pac-Man project to check for particular fruits. As you can see, the apple returns true because it is included in the array (in fact, there are two apples), and the watermelon returns false because it is not in the fruitBonus array.

// Example from my Pac-Man project
const fruitBonus = ['🍒','🍓','🍊','🍊','🍎','🍎','🍈','🍈','🚀','🔔','🔑'];

console.log(fruitBonus.includes('🍎')); // true
console.log(fruitBonus.includes('🍉')); // false

⚠ Important: There are limitations to using .includes(). While it works perfectly for primitive values like numbers, strings, and emojis, it does not perform deep checks for nested arrays or objects. Using .includes() with arrays or objects will only return true if the reference matches exactly—not if the contents are the same. You’ll need a different approach for deep comparisons, such as using .some() with a custom comparison function.

Putting .includes() to Good Use

I successfully used .includes() to improve ghost movement in my JavaScript Pac-Man game! I created an array containing all the intersection indices on the game board, and used .includes() to detect when a ghost enters an intersection. This allows the ghost to change direction at the correct spots, just like in the original arcade game.

The intersectionIndices array:

export const intersectionIndices = [
    34, 49,
    141, 146, 149, 152, 155, 158, 161, 166,
    230, 245,
    320, 323,
    377, 378,
    398, 401, 410, 413,
    485, 494,
    566, 569, 578, 581,
    650, 653, 656, 659, 662, 665,
    731, 752,
    824, 827
];

Adding the Intersections

During board construction, squares whose index is listed in intersectionIndices are assigned the 'intersection' class. This visually and logically marks those squares as intersections for game logic.


export function buildTheBoard() {
  for(let i = 0; i < 868; i++) {
    let div = document.createElement("div");
    gameGrid.appendChild(div);  
    squares.push(div);
    squares[i].classList.add('game-board-square');  

    if (intersectionIndices.includes(i)) {
      squares[i].classList.add('intersection');
    }    
  }    
}

Below, you can see every intersection included in the intersectionIndices array, courtesy of the ‘intersection‘ class:

Helper Intersection function

Here is a simple helper function, used for game logic, that takes an index as a parameter, uses .includes(), and returns true if the specified index is an intersection:

// Helper function to check if a given index is an intersection
function isIntersection(index) {
  return intersectionIndices.includes(index);
}

Improved Ghost Movement using .includes()

Now that I have a function that detects intersections, I can use it to see if a ghost’s current index includes one. Once a ghost enters an intersection, I trigger a direction change—making the ghosts smarter!

How It Works: Each ghost moves automatically on a timer. At every step, the code checks if the ghost is on an intersection square (using isIntersection and .includes()). If the ghost is at an intersection:

The code figures out which directions are possible (not blocked by walls or other ghosts).
It avoids making the ghost immediately turn around (no U-turns unless stuck).
It randomly picks one of the valid directions and updates the ghost’s movement.

// Ghost movement logic uses isIntersection to trigger intersection behavior
export function moveGhost(ghost) {
  const directions = [-1, 1, 28, -28];
  let direction = ghost.direction || directions[Math.floor(Math.random() * directions.length)];

  ghost.timerId = setInterval(function() {
    // ...existing movement logic...

    // At intersections, choose a new direction
    if (isIntersection(ghost.currentIndex)) {
      const reverseDir = ghost.previousIndex - ghost.currentIndex;
      let validDirections = directions.filter(dir => {
        if (dir === reverseDir) return false;
        const nextIndex = ghost.currentIndex + dir;
        return (
          !squares[nextIndex].classList.contains('ghost') &&
          !squares[nextIndex].classList.contains('lairText') &&
          !squares[nextIndex].classList.contains('wall') &&
          !(dir === 28 && squares[nextIndex].classList.contains('lairWall')) &&
          (nextIndex !== 375) &&
          (nextIndex !== 380)
        );
      });

      if (validDirections.length === 0) {
        validDirections = [reverseDir];
      }

      if (validDirections.length > 0) {
        direction = validDirections[Math.floor(Math.random() * validDirections.length)];
        ghost.direction = direction;
      }
    }

    // ...rest of movement logic...
  }, ghost.speed);
}

By checking for intersections with JavaScript’s .includes(), I ensure ghosts only change direction at the right spots. This brings my project closer to the original arcade experience and creates more authentic, challenging gameplay!

JS Pac-Man Project Links:

🔗 Link to the deployed project

🔗 Link to GitHub

🔗 Link to the sprint board

Note: Since I’m following team development practices and pushing updates to the develop branch, some of the changes I describe in this article may not be live in the deployed version of the game yet.

My other related articles

Be sure to listen to the HTML All The Things Podcast!

📝 I also write articles for the HTML All The Things Podcast, which you can read on their website: https://www.htmlallthethings.com/.

Be sure to check out HTML All The Things on socials!

Affiliate & Discount Links!

To learn more about CodeMonkey, you can read my detailed review article!

Affiliate Links:

Advance your career with a 20% discount on Scrimba Pro using this affiliate link!

Important: This discount is for new accounts only. If a higher discount is currently available, it will be applied automatically.

How to Claim Your Discount:

Click the link to explore the new Scrimba 2.0.
Create a new account.
Upgrade to Pro; the 20% discount will automatically apply.

Disclosure: This article contains affiliate links. I will earn a commission from any purchases made through these links at no extra cost to you. Your support helps me continue creating valuable content. Thank you!

Conclusion

The JavaScript .includes() method checks whether an array contains a specific element, returning true if it does and false if it doesn't. It’s great for verifying if an array has a particular value, but it does have limitations. While it works well for simple values like numbers, strings, or (in my project’s case) emojis, it doesn’t check inside nested arrays or objects.

By utilizing .includes() in the function that controls the ghosts in my Pac-Man game, I can determine when a ghost’s current index enters an intersection and trigger a direction change. This makes the ghosts smarter and brings my project closer to the original arcade experience!

Just as I used .includes() with an array of intersections to improve game logic, you can also find creative ways to combine this method with your own data structures. Explore how .includes() can simplify checks and enhance features in your projects—experiment and see what smart solutions you can build!

Let’s connect! I’m active on LinkedIn and Twitter.

Do you now feel confident using JavaScript's .includes() for array searches? Have you applied similar techniques in your projects? Please share the article and comment!

JavaScript: Array Iteration and DOM Manipulation in Game Development

Michael J. Larocca — Mon, 13 Oct 2025 17:36:04 +0000

This article explores JavaScript array iteration and DOM manipulation, including practical game development examples. You will also learn a game-state sync technique to enhance your own projects!

Array Iteration

What is array iteration? Array iteration is the process of sequentially accessing each element in an array to perform operations or calculations. This technique is essential in JavaScript for efficiently managing and manipulating data stored in arrays, such as updating game states or displaying information.

In my JavaScript Pac-Man game, I store information in arrays and iterate through them for my game logic to carry out various tasks. For example, the fruit bonus that appears twice per level utilizes an emoji and a matching point value based on the level.

For a simple demonstration, the code block below shows an iteration over the fruitBonus array: The console logs the corresponding emoji along with the point value stored in the fruitBonusValue array.

// Arrays store fruit icons and their bonus values for each level
export const fruitBonus = ['🍒','🍓','🍊','🍊','🍎','🍎','🍈','🍈','🚀','🔔','🔑'];
export const fruitBonusValue = [100,300,500,500,700,700,1000,1000,2000,3000,5000];

// Example: Display all fruit bonuses and their values
for (let i = 0; i < fruitBonus.length; i++) {
  console.log(`Level ${i + 1}: ${fruitBonus[i]} = ${fruitBonusValue[i]} points`);
}

// Console log:
"Level 1: 🍒 = 100 points"
"Level 2: 🍓 = 300 points"
"Level 3: 🍊 = 500 points"
"Level 4: 🍊 = 500 points"
"Level 5: 🍎 = 700 points"
"Level 6: 🍎 = 700 points"
"Level 7: 🍈 = 1000 points"
"Level 8: 🍈 = 1000 points"
"Level 9: 🚀 = 2000 points"
"Level 10: 🔔 = 3000 points"
"Level 11: 🔑 = 5000 points"

(The actual game logic is more complex but follows the same iterative approach.)

Array Iteration and DOM Manipulation

The Document Object Model (DOM) is a programming interface for web documents, representing the page structure as a tree of objects. With JavaScript, you can manipulate the DOM to dynamically alter a webpage's content, structure, and style, enabling you to build interactive and responsive user experiences.

The main functionality of game level completion in my project is for Pac-Man to eat all the pellets on the game board. I initially handled this by checking if Pac-Man’s current index also had a CSS pellet class, using the JavaScript includes method. However, this approach proved unreliable for tracking game progress. To solve this, I created a dedicated pelletState array to track the state of each pellet throughout the game.

Now with the pelletState array, I can properly track the status of every pellet and power pellet on the board, regardless of visual glitches or overlapping game elements. This ensures that Pac-Man’s progress, level completion, and scoring are always accurate, and the game logic remains in sync with what the player sees.

However, a new glitch emerged: ghosts occasionally removed CSS pellet classes while traversing through the gameboard, preventing level completion because the corresponding pellets remained in the pelletState array. It was a pretty funny glitch because the ghosts would eventually return the pellets when they passed by the divs they took them from, as if they were cheating me out of finishing the level! 👻

As part of my pelletState array solution, the CSS pellet classes are temporarily removed from a square when a ghost enters and restored when the ghost leaves. The pellet’s state, however, is always tracked in the array, ensuring consistent game logic regardless of visual changes. This approach is necessary due to CSS scaling; ghosts visually shrink to the size of the pellet when sharing a square, so managing the classes separately prevents display issues.

Syncing Game State and DOM with Array Iteration

I created a syncPelletClasses function to keep the pelletState array and pellet CSS classes in sync, running it every time the board state changes. This function, syncPelletClasses(), iterates through the pelletState array and updates the DOM for each square: if a pellet or power pellet is present in the array and no ghost is on that square, the corresponding CSS class is added; if a ghost is present, the class is removed. This keeps the visuals accurate without affecting the underlying game logic.

By separating the visual state (CSS classes) from the game state (the array), I ensured that pellets are never “lost” due to ghost movement or display quirks. Pac-Man’s progress and level completion are now reliably tracked, and the game remains arcade-authentic—even when ghosts and pellets overlap.

export function syncPelletClasses() {
  for (let i = 0; i < pelletState.length; i++) {
    // Only add pellet class if no ghost is present
    if (pelletState[i] === 'pellet' && !squares[i].classList.contains('ghost')) {
      squares[i].classList.add('pellet');
    } else {
      squares[i].classList.remove('pellet');
    }
    if (pelletState[i] === 'powerPellet' && !squares[i].classList.contains('ghost')) {
      squares[i].classList.add('powerPellet');
    } else {
      squares[i].classList.remove('powerPellet');
    }
  }
}

💡 Tip: By utilizing this game-state sync technique, you can build more reliable, visually accurate games and interactive apps. Try applying array-driven state management in your own projects for smoother, bug-free experiences!

JS Pac-Man Project Links:

🔗 Link to the deployed project

🔗 Link to GitHub

🔗 Link to the sprint board

Note: Since I’m following team development practices and pushing updates to the develop branch, some of the changes I describe in this article may not be live in the deployed version of the game yet.

My other related articles

Be sure to listen to the HTML All The Things Podcast!

📝 I also write articles for the HTML All The Things Podcast, which you can read on their website: https://www.htmlallthethings.com/.

Be sure to check out HTML All The Things on socials!

Affiliate & Discount Links!

To learn more about CodeMonkey, you can read my detailed review article!

Affiliate Links:

Advance your career with a 20% discount on Scrimba Pro using this affiliate link!

Important: This discount is for new accounts only. If a higher discount is currently available, it will be applied automatically.

How to Claim Your Discount:

Click the link to explore the new Scrimba 2.0.
Create a new account.
Upgrade to Pro; the 20% discount will automatically apply.

Disclosure: This article contains affiliate links. I will earn a commission from any purchases made through these links at no extra cost to you. Your support helps me continue creating valuable content. Thank you!

Conclusion

Array iteration lets you efficiently access and update each element in a collection, making it a foundation for managing dynamic data in JavaScript. The Document Object Model (DOM) is a programming interface representing a webpage's structure as a tree of objects, which, in JavaScript, allows for dynamic modification of content, structure, and style for interactive experiences.

Using array iteration for DOM manipulation, I solved glitches in my game using array-driven state management: I used a syncPelletClasses function to align the pelletState array with the DOM, updating visuals based on game state changes. This solution ensured that the game logic always matched what players saw on screen and what was accessible to the code.

If you’re building interactive apps or games, try leveraging array-driven state management and DOM syncing techniques to help create smoother, more reliable user experiences!

Let’s connect! I’m active on LinkedIn and Twitter.

Do you now have a better understanding of JavaScript array iteration and DOM manipulation? Are you ready to use these techniques to improve your own projects? Please share the article and comment!

Forem: Michael J. Larocca

Turning Learning Into Opportunity: Social Media Strategies from Marko Denic

Introduction

Leveraging Social Media

How to Provide Real Value

Building Connections

How to Stand Out

Using AI Effectively

Marko’s Links

About Marko Denic

My other related articles

Don't miss this episode – tune in to the Podcast now!

🎙Leveraging Social Media and Content Creation | w/ Marko Denic

Stay up to date by following HTML All The Things on our social channels.

How to support the show

Patreon

Learn with Scrimba!

Sponsored content: The original publisher kindly sponsored this article, allowing me to share my expertise and knowledge on this topic.

Conclusion

Let's connect! I'm active on LinkedIn and Twitter.

You can read all of my articles on selftaughttxg.com

Learn to Code for Free and Land Your First Developer Job

Introduction

What is freeCodeCamp?

Why Learn Coding With freeCodeCamp?

How You Learn With freeCodeCamp

My freeCodeCamp Certification

Education and Certifications for Tech Careers

Empowering Busy Adults

Importance Of Learning The Fundamentals

AI in Coding: Tool, Not Crutch

The Importance of Hands-On Practice

Preparing for Your Job Search

Job-Hunting Tips From Quincy’s Free Book

📘 FREE Book! How to Learn to Code and Get a Developer Job

Exploring More Free and Affordable Learning Resources

Invest in Yourself, The Future Is Bright!

Quincy's Links

About Quincy Larson

My other related articles

Don't miss this episode – tune in to the Podcast now!

🎙Inside freeCodeCamp: Learning to Code in 2025 | w/ Quincy Larson

Stay up to date by following HTML All The Things on our social channels.

How to support the show

Patreon

Learn with Scrimba!

Torc is an AI-powered platform and vibrant global network that connects skilled professionals with top opportunities and forward-thinking companies. If you’re interested in joining, you can create a free profile using my referral link: https://platform.torc.dev/#/r/b5QZ7k5h/cp

Sponsored content: The original publisher kindly sponsored this article, allowing me to share my expertise and knowledge on this topic.

Conclusion

Let's connect! I'm active on LinkedIn and Twitter.

You can read all of my articles on selftaughttxg.com

Micro-Frontends: What They Are and Why You Should Use Them

In this continuing hackathon coverage article, we explore how the team is progressing in building an AI-powered travel agent app using micro-frontends, Module Federation, and other modern tools!

About The Hackathon

What Are Micro-Frontends

Why Use Micro-Frontends

What Is Module Federation

Personal Reflection

Team Champs TripWeave app in progress

How We Use Micro-Frontends in the Hackathon

Gridiron Survivor Hackathon & Zephyr Cloud

Further Learning

Gridiron Survivor Sponsors

My other related articles

Be sure to listen to the HTML All The Things Podcast!

📝 *I also write articles for the HTML All The Things Podcast, which you can read on their website:* https://www.htmlallthethings.com/.

Be sure to check out HTML All The Things on socials!

Torc is an AI-powered platform and vibrant global network that connects skilled professionals with top opportunities and forward-thinking companies. If you’re interested in joining, you can create a free profile using my referral link: https://platform.torc.dev/#/r/b5QZ7k5h/cp

Affiliate & Discount Links!

Advance your career with a 20% discount on Scrimba Pro using this affiliate link!

Important: This discount is for new accounts only. If a higher discount is currently available, it will be applied automatically.

Disclosure: This article contains affiliate links. I will earn a commission from any purchases made through these links at no extra cost to you. Your support helps me continue creating valuable content. Thank you!

Conclusion

Are you now curious about building apps with micro-frontends and Module Federation? Are you considering using these tools in your next project? Please share the article and comment!

Hackathon Highlights: Building and Livestreaming an AI Travel Agent

In this week's article, we dive into a sponsored hackathon where we build an AI-powered travel agent app—competing, collaborating, livestreaming, and more! Follow along to learn real-world dev skills!

Hackathon AI Agent Challenge

AI Agent, Travel Agent

Livestream Presentations

Sharing Our Learnings

**📝 I also write articles for the HTML All The Things Podcast, which you can read on their website: https://www.htmlallthethings.com/**.

**📝 I also write articles for the HTML All The Things Podcast, which you can read on their website: https://www.htmlallthethings.com/**.

Important: This discount is for new accounts only. If a higher discount is currently available, it will be applied automatically.

Disclosure: This article contains affiliate links. I will earn a commission from any purchases made through these links at no extra cost to you. Your support helps me continue creating valuable content. Thank you!

**📝 I also write articles for the HTML All The Things Podcast, which you can read on their website: https://www.htmlallthethings.com/**.

Important: This discount is for new accounts only. If a higher discount is currently available, it will be applied automatically.

Disclosure: This article contains affiliate links. I will earn a commission from any purchases made through these links at no extra cost to you. Your support helps me continue creating valuable content. Thank you!