diff --git a/how-to-become-a-full-stack-developer/README.md b/how-to-become-a-full-stack-developer/README.md new file mode 100644 index 0000000000..742b3eb057 --- /dev/null +++ b/how-to-become-a-full-stack-developer/README.md @@ -0,0 +1,17 @@ +# Full Stack Roadmap Materials + +Supporting files for [How to Become a Full Stack Developer: What Jobs Ask For](https://realpython.com/how-to-become-a-full-stack-developer/). + +- `roadmap-checklist.md`: the printable checklist, one box per skill. +- `slice/`: a minimal full stack slice. A Node.js server sends JSON, and a + web page fetches it and shows it. It needs Node.js 26 and no packages. + +Run the slice: + +```console +$ cd slice +$ node server.mjs +Listening on http://localhost:3000 +``` + +Then open http://localhost:3000 in a browser. diff --git a/how-to-become-a-full-stack-developer/roadmap-checklist.md b/how-to-become-a-full-stack-developer/roadmap-checklist.md new file mode 100644 index 0000000000..979b8fe86e --- /dev/null +++ b/how-to-become-a-full-stack-developer/roadmap-checklist.md @@ -0,0 +1,31 @@ +# Full Stack Developer Roadmap Checklist + +Tick each box when you can do the thing without looking it up. +Pace assumed: about 10 hours a week. + +## Stage 1: HTML and CSS +- [ ] Build a page with headings, links, images, and a form +- [ ] Style it with CSS and make it work on a phone-sized screen + +## Stage 2: JavaScript in the browser +- [ ] Change the page when someone clicks a button +- [ ] Fetch JSON from a URL and show it on the page + +## Stage 3: A server with Node.js +- [ ] Run a Node.js server that answers with JSON +- [ ] Install a package with npm + +## Stage 4: A database +- [ ] Save and read data so it survives a restart + +## Stage 5: Ship it +- [ ] Put your project on GitHub +- [ ] Deploy it so a stranger can open the link + +## Before you apply: React and TypeScript +- [ ] Rebuild one of your projects' pages with React components +- [ ] Add TypeScript types to that project and fix what the checker flags + +## Ready to apply +- [ ] Two or three deployed projects, each with a front end, a server, and a database +- [ ] Each project has a public repository with a README that says what it does and how to run it diff --git a/how-to-become-a-full-stack-developer/slice/index.html b/how-to-become-a-full-stack-developer/slice/index.html new file mode 100644 index 0000000000..cbe86a8a83 --- /dev/null +++ b/how-to-become-a-full-stack-developer/slice/index.html @@ -0,0 +1,23 @@ + + +
+ +