Skip to content

danieaneta/Web-App-Builders-Bootcamp

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

11 Commits
 
 
 
 
 
 

Repository files navigation

Web-App-Builders-Bootcamp

cover-image

Welcome to the Web App Builders 26 Week (~6 Months) Bootcamp!
A Free and Open-Source Project-Based "Junior" Full-Stack Developer Bootcamp for Beginners.

Table of Contents


Bootcamp Overview

This bootcamp will have you building from Week 1, and by Week 22 you will be building and deploying a full‑stack web app on AWS. The frontend and backend remain separate until Weeks 11 and 12, when you will build your first few full‑stack apps. The goal is to help you gain confidence in web app development by working on practical projects. While this bootcamp won’t cover every detail, it provides a clear roadmap for learning the essentials to start building your own powerful applications.

This free and open‑source resource was created to give back to the community—something I wish had been available when I began my own journey in tech.

To view the bootcamp, please download the "Junior-FT_Bootcamp.pdf" from the repo. 01_pdf_download 02_pdf-download


Intro and Foreword

Hello!

This is a “junior” full‑stack developer bootcamp curated using free and open‑source resources. Realistically, you might be hard pressed to find an actual “junior full‑stack developer” role—but they do exist. Given the current job market, economic climate in North America, and broader tech landscape, full‑stack development roles are likely to increase due to factors such as AI, funding, and evolving market forces.

Having been laid off in 2022 and needing to rebuild my career, I learned that change is constant. While roles may shift or disappear, the ability to build applications remains an invaluable skill. This bootcamp is a call to action: view yourself as a builder, ready to adapt and create impactful applications.

Before we dive in, consider the debate around AI’s role in development. For further reading on AI and its current limitations:

Even if tech jobs are offshored, your skills as a developer remain valuable. Keep building, stay adaptable, and remember: having something built is always better than having nothing built.


About the Bootcamp

Bootcamp Pipeline Explanation Video - How to do the bootcamp!

While I organized the learning pipeline, the real credit goes to the creators of the resources linked throughout this bootcamp. I encourage you to explore their channels and social media!

This bootcamp is divided into three distinct sections:

  • Frontend
  • Backend
  • Intro to Programming

These sections eventually converge when we begin building full‑stack applications, highlighting the unique intricacies of each area.

Instead of working on guided projects, the initial projects within this bootcamp will push you to work on projects on your own in an "explorative" way. This is to reinforce the topics you are learning from each video within the first few weeks.

Eventually, during the harder projects, you will be presented with guided projects and have a chance to work on your own app to reinforce your learning.

Important Notes:

  • Complete each lesson sequentially (e.g., Week 1 of Frontend, Backend, and Intro to Programming should be done concurrently).
  • There WILL be times where you may not know what to do during explorative projects, just remember that times like these will happen during the job and not just in this bootcamp. Force yourself to figure it out on your own. This is a skill that you will hone during the next few months, and will take you far afterwards.
  • Mastery comes with practice, time, and experience—exposure alone is not enough.
  • After finishing the bootcamp, continue building and honing your skills with your own projects!

Weekly Breakdown

Weeks 1 - 6

Frontend

  • Learn the basics of HTML, CSS, and JavaScript.
  • Write markup in HTML and practice basic CSS.
  • Understand HTML Best Practices and Semantic HTML.
  • Learn CSS Flexbox and CSS Grid.
  • Build basic landing pages with the techniques you’ve learned.
  • Do a deep dive into CSS Grid and Flexbox, as well combining them.
  • You will learn to combine HTML, CSS and Javascript by creating 4 apps.
  • Reinforce website design, color theory, learn and practice responsive web design.
  • Learn about what ReactJS is and learn how to utilize React.

Backend

  • Introduction to Database Management Systems.
  • Learn about backend responsibilities and Database Fundamentals.
  • Study RDBMS, SQL, and databases like MySQL, PostgreSQL, and SQLite.
  • Design database schemas for projects.

Intro to Programming

  • Learn about computer components and an overview of Computer Science.
  • Explore algorithms, data structures, and programming principles.
  • Understand different programming paradigms and web app architecture.

Weeks 7 - 10

Frontend

  • Build your own React apps.
  • Learn Tailwind CSS and Next.js.
  • Understand the difference between React and Next.js.
  • Enjoy a frontend building break.

Backend

  • Reinforce backend web development.
  • Explore tech stacks and understand HTTP/HTTPS, requests, responses, and REST.
  • Practice asynchronous programming in JavaScript.
  • Learn about API design, database selection (including NoSQL options like MongoDB), and software architecture.
  • Study various API architecture styles (gRPC, SOAP, Websockets, GraphQL, WebHooks), CORS, and web security basics.

Weeks 11 - 13

  • Learn about CRUD operations and applications.
  • Build 6 full‑stack applications using different tech stacks.
  • Develop your own CRUD application.

Weeks 14 - 17

  • Build 4 Next.js apps.
  • Learn TypeScript.

Weeks 18 - 20

  • Build advanced full‑stack applications.

Weeks 21 - 25

  • Learn about virtualization, Docker, and Kubernetes.
  • Explore Cloud Computing and system design.
  • Get introduced to AWS services.
  • Build and deploy a full‑stack application on AWS.

Project Information

The bootcamp includes a variety of projects to solidify your learning:

  • Beginner Explorative Projects:

    • 3 HTML Markup Projects
    • 3 Basic HTML/CSS Projects (without using CSS Flex or Grid)
    • Design 3 Landing Pages on Figma (Optional)
    • Write 4 JSON Objects
    • Write 3 JavaScript Console Programs
    • Build 3-5 Basic Landing Pages with HTML & CSS
    • 3 Projects using basic alerts, prompts, and confirmations (practicing JavaScript + DOM)
  • HTML, CSS, and JavaScript Apps:

    • Color Picker App (Guided)
    • To-Do List (without storage) (Guided)
    • Simple Counter App (Guided)
    • Random Quote Generator (Guided)
    • Create your own JavaScript app (Explorative)
  • Design Schema Projects:

    • Library Management System (Explorative)
    • Student Enrollment System (Explorative)
    • Employee Attendance Tracker (Explorative)
    • Movie Rental Database (Explorative)
  • React Apps (Explorative):

    • Random Quote Generator App
    • Counter App
    • To-Do List App
    • Simple Theme Switcher App
    • Weather Display App
    • Feedback Rating App
    • Recipe Display App
    • Simple Blog App
  • Asynchronous JavaScript Projects (Explorative):

    • Fetch and Display API Data
    • Timer with Promises
    • Dynamic Content Loader
    • Building RESTful APIs Project Playlist (Guided)
  • Full-Stack Applications (Guided):

    • CRUD Application Project (React, Node.js, MySQL)
    • Social Media App (React, Node.js, MySQL)
    • Admin Dashboard (React)
    • Booking App (MERN)
    • Product Store App (PERN)
    • Real-Time Chat App (MERN)
    • Build Your Own CRUD App (Guided)
    • Social Media App (React, Next.js) (Guided)
    • Video Calling Interview Platform App (React, Next.js) (Guided)
    • Build a SaaS Code Editor (React, Next.js) (Guided)
    • Stripe App Project (Guided)
    • Advanced MERN Auth Project (Guided)
    • Advanced Spotify Clone (MERN) (Guided)
    • Build and Deploy Inventory Management (Next.js, AWS) (Guided)
    • Build and Deploy Your Own Full‑Stack Application! (Explorative)

Final Words and Resource Links

Congratulations on making it this far! I hope this bootcamp has added value to your tech journey. Before you go, please check out the list of creators referenced throughout the bootcamp. I strongly encourage you to explore their channels and social media accounts.

Also, please consider starring this repository, as updates and changes will be made over time. For more insights on tech, AI, and software development, follow me on Threads at @danie.aisolutions.

Resource Links

About

A Free and Open-Source "Junior" Full-Stack Developer Bootcamp for Beginners.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published