FARISITE

  Hari 1 – Instalasi & Pengenalan Dasar Next.js (App Router) Pada hari pertama ini, kita akan memulai dari nol , mulai dari persiapan environment , instalasi Next.js, hingga memahami konsep dasar routing dan membuat halaman pertama. Tutorial ini menggunakan Windows + VS Code dan cocok untuk pemula. 1. Persiapan Environment Sebelum menginstal Next.js, pastikan beberapa tools berikut sudah tersedia di komputer. 1.1 Install Node.js Next.js membutuhkan Node.js untuk berjalan. Unduh Node.js versi LTS (Long Term Support) Instal seperti aplikasi biasa Setelah selesai, restart komputer (penting agar PATH terbaca) 1.2 Cek Instalasi Node.js dan npm Buka Terminal / PowerShell , lalu jalankan: node -v npm -v Jika muncul versi (contoh: v20.x.x ), berarti Node.js berhasil terpasang. 2. Membuat Project Next.js 2.1 Masuk ke Folder Kerja Masuk ke folder tempat kamu biasa menyimpan project web, misalnya: cd %USERPROFILE%\Documents\web Sesuaikan dengan folder masi...

Introduction When setting up a VPS for hosting websites or applications, one of the first decisions you’ll face is choosing a web server. The two most popular options are Nginx and Apache . Both are powerful, widely used, and production-ready — but they work very differently. In this article, we’ll compare Nginx vs Apache , explain how each one works , highlight their strengths and weaknesses , and help you decide which web server is better for your VPS setup . What Is a Web Server? A web server is software that: Receives requests from browsers Processes those requests Serves HTML, CSS, JavaScript, or API responses Popular web servers include: Nginx Apache LiteSpeed Caddy Among them, Nginx and Apache dominate most VPS environments . What Is Apache? Apache has been around since the mid-1990s and was the most widely used web server for many years. How Apache Works Apache uses a process-based or thread-based model : Each request is handled by a p...

Introduction Many React developers are surprised when their app works perfectly during development — but behaves differently after deployment. Features break, routing fails, environment variables disappear, or performance changes dramatically. Most of these issues come from not understanding the difference between React’s development mode and production (build) mode . In this article, we’ll explain: What development mode really does What changes in production builds Why bugs appear only after deployment How to avoid common build-related mistakes What Is Development Mode in React? Development mode is what you use when running commands like: npm start npm run dev In this mode, React prioritizes developer experience , not performance. Key Characteristics of Development Mode Detailed error messages Helpful warnings Hot reloading (instant updates) Slower performance (on purpose) Extra checks for unsafe patterns Development mode helps you find bugs e...

  Introduction React routing often works perfectly during development — but suddenly breaks in production . Pages show a blank screen, return 404 errors, or fail when users refresh the browser. If you’ve ever asked: “Why does my React routing work locally but not after deployment?” This article will give you a clear, practical explanation . We’ll cover: How React routing actually works Why it breaks in production The most common mistakes How to fix routing issues correctly How React Routing Works React applications use client-side routing , most commonly with React Router . Instead of the server handling routes like: /about /contact /products React: Loads one HTML file ( index.html ) Uses JavaScript to switch views Updates the URL without reloading the page This is fast and smooth — but it creates problems if the server is not configured properly. Why Routing Works in Development During development: You usually run npm run dev or npm s...