The best way to enhance your skills or land a great job is to build awesome projects, now some projects do hold more power over others and will definitely teach you more than some others will. So my advice is to skip the boring to-do app and build these 4 listed projects to help take your developer skills to the next level.
Full Stack CRUD app with AUTH
This first projects covers almost all the scenarios you will run into most often in your developer career. Here is what you will build: This project will need a backend and front-end , if you are a JavaScript developer I recommend NodeJS and the EJS templating engine. This app should use all common CRUD operations throughout the application, for a Database stick with MongoDB.
The app will be a basic blogging platform, where users can signup with google and manage their account details (info, display picture etc) Each user that signs up gets a blog. They should be able to create, update and delete their OWN articles. View any other article created by any other user. The app should feature a home page that displays the most recent articles, who the author is and link to that article. Add the ability to delete your account completely as well. The design of the UI is not important here so feel free to use any template you want.
Real world example:
Medium - Where good ideas find you.
SPA using a public API & AUTH with Firebase.
Here we will build a Single Page Application with any front-end framework of your choice, React, VueJS, Angular. it doesn’t matter. What’s important here is design and SPA fundamentals. Try and take the time to design the UI yourself and build it with a CSS framework such as Tailwind CSS.
What you will build is a movie database lookup. The app will feature a real time search for any movie, give all the information about the movie and the ability to add the movie to your favourites. The authentication should be kept as simple as possible. The one rule is you are not allowed to store any movie information besides the movies ID’s on Firebase.
Real World Example:
Serverless blog with a headless CMS.
Serverless applications are becoming more and more popular, and its important that you understand how they work. I highly recommend you do this with either NextJS or NuxtJS.
What you will build is a simple blog for a single user that pulls all the articles from an external CMS such as Strapi, Contentful or Butter CMS. Its import that the blog must be SSR and be rendered statically to the client. Try and get a lighthouse score of at least 90!
Real World Example:
Live service chat application with web sockets.
Web sockets are very powerful and can be if used properly. This application is probably the hardest but the most fun. Just build a simple chat server where people can sign up, join or create new chat rooms to send secure messages to each other. Not much more to say about this.
Real world Example: