Skip to content

Beginner · What full-stack development is · topic 1 of 34 · 25 min

What full-stack means

Explanation

Every web app has three layers: the frontend that users see in the browser, the backend server that applies the rules, and the database that stores the data. A full-stack developer can build all three and connect them. In this course you will build one real project, a Notes app, layer by layer.

Three layers in every web app

Open any app you use daily: a food delivery app, a college results site, a train booking site. Behind it there are almost always three parts that work together. Developers call this set of parts the stack, because the layers sit on top of each other.

  • Frontend: everything the user sees and touches, such as pages, buttons and forms. It runs in the browser (or in a phone app) and is built with HTML, CSS and JavaScript, often with a library like React.
  • Backend: a program running on a server, which is a computer that is always on and connected to the internet. It checks who you are, applies the rules ("a note title cannot be empty") and answers requests through an API.
  • Database: the place where data is stored safely so it is still there tomorrow, such as users, notes and orders. The backend reads and writes it, usually with SQL.

An API (Application Programming Interface) is the set of requests the backend accepts, for example "give me my notes" or "save this note". The frontend never talks to the database directly. It always asks the backend through the API, and the backend decides what is allowed.

Think of it like this: Think of a restaurant. The dining hall with the menu card and the waiter is the frontend: it is what customers see. The kitchen is the backend: it follows recipes and rules, and it refuses an order for a dish that is finished. The store room is the database: it keeps rice, dal and vegetables safe until the kitchen needs them. Customers never walk into the store room themselves.

So what is a full-stack developer?

A frontend developer mainly builds the screens. A backend developer mainly builds the server and the database. A full-stack developer can build a feature through all three layers: the button, the API route behind it and the table that stores the result. They also connect the layers, which is where many bugs hide.

LayerRuns whereMain tools in this courseTypical job
FrontendThe user's browserHTML, CSS, JavaScript, ReactShow the notes list, handle the Save click
BackendA serverNode.js, ExpressCheck the login, validate the title, answer with JSON
DatabaseA database serverSQL (SQLite to learn, PostgreSQL in production)Store notes and find them by user

T-shaped skills

Nobody is an expert in everything. Good full-stack developers are T-shaped: the top bar of the T is broad knowledge of every layer, enough to build and fix a whole feature. The tall stem of the T is deep skill in one area, for example React on the frontend or databases on the backend. Aim to be useful everywhere and strong in one place.

Tip: Pick your "deep" area after you finish this course, based on what you enjoyed most and what jobs near you ask for. You do not need to decide on day one.

Where full-stack work exists in India

  • Startups: small teams need people who can ship a whole feature alone, so full-stack skills are valued highly.
  • Product companies: build and run their own apps; they hire full-stack and specialist developers.
  • IT service companies: build projects for clients; many projects use Java (Spring Boot) or .NET with React or Angular.
  • Agencies: build websites and small apps for local businesses, often on short deadlines.
  • Freelancing: clients want a complete working app, not just one layer, so full-stack skills help you take whole projects.
Careful: Job titles and salaries vary a lot between cities and companies, and they change every year. Read real job posts near you (and remote ones) instead of trusting one number you saw in a video.

The project: a Notes app

In this course you build one app from start to finish: a Notes app. Users sign up, log in, and then create, edit, delete, pin and search their own notes. It is small enough to finish, but it has every part a real product has: screens, an API, a database, login, deployment and tests. Each module adds one piece, and at the end it goes in your portfolio.

Watch the lesson

What full-stack means · 1/7

Full-stack = frontend + backend + database

Welcome to the full-stack course. First, what does full-stack mean?

Prefer a video by a teacher? Find free videos on “what is full stack web development frontend backend database explained for beginners” on YouTube ↗

In real life: One feature, three layers: a food delivery order

When you place an order in a food delivery app, the frontend shows the menu, the cart and the Place order button. When you tap it, the backend checks that the restaurant is open, the items are in stock and the payment went through, then it creates the order. The database stores the order, the items and the delivery address, so the restaurant, the delivery partner and you all see the same order a minute later. A full-stack developer could build that whole feature, from the button to the table.

Practice (0/3 done)

Task 1 · Code · Javascript

The LAYERS object below maps jobs in the Notes app to their layer. Write layerOf(job) that returns the layer for a job ("frontend", "backend" or "database"). Ignore spaces at the start and end and ignore upper and lower case. If the job is not in the table, return "unknown".

Task 2 · Code · Javascript

A feature list is an array of objects like { job: "show the cart", layer: "frontend" }. Write countLayers(jobs) that returns how many jobs belong to each layer, as an object with the keys in this order: frontend, backend, database. A layer with no jobs gets 0. Ignore any job whose layer is something else.

Task 3 · Practice

Pick a food delivery app you know. List 8 things it does (for example "show restaurants near me" or "track the delivery partner") and, for each one, write which layers take part and what each layer does. Then write two sentences on which features you could build alone after this course.

Quick quiz

Question 1

1.Where does the frontend of a web app run?

Question 2

2.Which job belongs to the backend?

Question 3

3.What does a T-shaped developer mean?

Question 4

4.How does the frontend usually get data from the database?

Question 5

5.In the restaurant analogy, what is the store room?

Read more (free)

Pass the quiz (60% or more) or mark this topic as done when you are ready.

Your progress is saved on this device only.

Next: What happens when you tap Save →