Scribd
Upload
13 views3 pages

Checklist_Fullstack_Developer

This document outlines a comprehensive checklist for learning fullstack development, divided into six phases: web fundamentals, modern frontend, backend development, fullstack project integration, deployment, and optional advanced topics. Each phase includes essential skills and tools such as HTML, CSS, JavaScript, React.js, Node.js, Express, and database management. The checklist also suggests example projects and deployment platforms to solidify learning and practical application.

Uploaded by

Fauzianuri Jamaludin
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
13 views3 pages

Checklist_Fullstack_Developer

This document outlines a comprehensive checklist for learning fullstack development, divided into six phases: web fundamentals, modern frontend, backend development, fullstack project integration, deployment, and optional advanced topics. Each phase includes essential skills and tools such as HTML, CSS, JavaScript, React.js, Node.js, Express, and database management. The checklist also suggests example projects and deployment platforms to solidify learning and practical application.

Uploaded by

Fauzianuri Jamaludin
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 3

Checklist Belajar Fullstack Developer

FASE 1: DASAR-DASAR WEB

HTML
 ☐ Struktur dasar HTML
 ☐ Elemen penting: div, span, img, a, form, input, dll.
 ☐ Semantic HTML (header, footer, main, article, dll.)

CSS
 ☐ Selektor, warna, margin, padding, border
 ☐ Flexbox
 ☐ CSS Grid
 ☐ Responsive Design (Media Queries)
 ☐ Transition & Animation dasar

JavaScript Dasar
 ☐ Tipe data & variabel
 ☐ If/else, loop, function
 ☐ Array dan object
 ☐ DOM Manipulation
 ☐ Event listener

Tools
 ☐ Git (init, commit, push, pull)
 ☐ GitHub (repo, branch, pull request)
 ☐ VS Code + Extensions (Prettier, ESLint, Live Server)

FASE 2: FRONTEND MODERN

JavaScript Lanjutan
 ☐ ES6+ (let/const, arrow function, destructuring)
 ☐ Array method (map, filter, reduce)
 ☐ Fetch API / Axios
 ☐ async/await & Promise

React.js
 ☐ Create React App / Vite
 ☐ Komponen, Props, State
 ☐ useEffect, useState, useRef
 ☐ Form handling
 ☐ Routing (React Router)
 ☐ Fetch data dari API

Styling
 ☐ Tailwind CSS
 ☐ CSS Modules / Styled Components

FASE 3: BACKEND DEVELOPMENT

Node.js + Express
 ☐ Setup Express Server
 ☐ Routing (GET, POST, PUT, DELETE)
 ☐ Middleware
 ☐ Error handling

Authentication
 ☐ JSON Web Token (JWT)
 ☐ Login/Register endpoint
 ☐ Middleware Auth

Database
 ☐ MongoDB (via MongoDB Atlas atau lokal)
 ☐ Mongoose (model, schema, relasi)
 ☐ CRUD Operation di database

API Tools
 ☐ Postman (test API)
 ☐ CORS & Body Parser

FASE 4: FULLSTACK PROJECT

Integrasi
 ☐ Buat API di backend
 ☐ Fetch API di React frontend
 ☐ Kirim data dari form React ke backend
 ☐ Simpan data ke database
 ☐ Tampilkan data dari backend ke frontend

Contoh Project
 ☐ Todo App
 ☐ Blog dengan login/register
 ☐ Dashboard pengguna
FASE 5: DEPLOYMENT

Deploy Frontend
 ☐ Deploy ke Vercel / Netlify

Deploy Backend
 ☐ Deploy ke Render / Railway / VPS

Konfigurasi
 ☐ Env file (.env)
 ☐ CORS config
 ☐ Endpoint public/private

FASE 6: LANJUTAN (OPSIONAL)

Pendalaman
 ☐ TypeScript dasar
 ☐ GraphQL
 ☐ WebSocket (chat/notifikasi real-time)
 ☐ Testing (Jest, Testing Library)
 ☐ Redux / Zustand (state management)
 ☐ Docker dasar

You might also like