DEV Community

loading...
Cover image for The 1 Ultimate Project

The 1 Ultimate Project

hb profile image Henry Boisdequin ・3 min read

Introduction

The one project which will impress anyone. Whether you are an experienced developer or a complete newbie this project will benefit you by teaching you how to create a massive full-stack application. This project will impress anyone you show it to. This project can be built with any tech stack. As this is a full-stack project, it needs to have a client and a server. The client can be anything you would like, some examples include: a website (React.js, Svelte, Angular, Vue, WebAssembly, Vanilla Javascript), a GUI (Python, C#, C++, Javascript), and a mobile app (React Native, Flutter, Java, Kotlin, Swift, Objective-C). The server can be written in any language using any framework. The database can be whatever you would like: PostgreSQL, Redis, MongoDB, MySQL, etc.

If I were to build this project my tech stack would be the following:

  • Client (Website):
    • React.js/Next.js
    • Chakra-UI
    • Tailwind CSS
    • Apollo Client
    • Framer Motion
    • Formik
  • Database:
    • PostgreSQL
    • Redis
  • Server (Typescript):
    • GraphQL/TypeGraphQL
    • Apollo Server
    • TypeORM
    • Node.js

Remember, this is just what I would pick, and you can use whatever tech stack you would like!

What will this project teach me?

This project will teach you the following:

  • Connecting to a database
  • Connecting to a server
  • Security
  • Styling
  • Testing
  • Hosting
  • DevOps
  • How to build a server
  • Fetching
  • Debugging
  • Developer Environment
  • The latest standards in the full-stack industry
  • Source Control/Opensource

What are the prerequisites to this project?

This project is an intermediate to advanced project. I would recommend having good knowledge of the backend and client language that you choose. Also, I would recommend having experience in the frameworks you choose for the server, database, and client. You will also need a code editor, I would recommend VSCode. Personally, I felt ready to tackle this project when I was 3 months into learning full-stack development. You can save this post and come back when you are ready or let's dive right in!

The Project

The project is... an e-commerce site. Some e-commerce site examples include a book store, a general-purpose store, a food store, clothing/styling store, a tech store, and much more. An e-commerce site is just an app in which you can buy/sell products online. Some companies which are an e-commerce site include Amazon, Airbnb, eBay, and more. This is the ultimate project because it will encapture the most concepts any project could encapture: security, frontend, server, database, and more.

Features:

  • Secure login/logout/register (if you want you can also use Google, GitHub, and others authentication)
    • Cookies, JWT, sessions, local storage
  • Forgot password/change password email link
    • Tokens
  • Routing
  • User page with their username, profile picture, bio, and recent purchases
  • A store where all the products are available
  • A place where users can add products to sell
  • A realtime shopping cart
  • A payment system
    • Stripe, PayPal, Google Pay, Apple Pay
  • Realtime messaging between sellers and consumers
  • Smooth animations
  • Dark mode/light mode
  • Deleting products they are selling
  • Reporting and banning users/products
  • Confirm account email

The possibilities are endless!

Conclusion

I wish you the best in making your own e-commerce site! If you have created one, please share it in the comments so that we can have a look at it! Thanks for reading.

Henry

Discussion (0)

pic
Editor guide