CodingNic

Project Setup

Welcome to the Project

Project Setup 5 min read

Welcome to the Project

Welcome to the Project

You’re going to build a contact book: a multi-page Next.js app with search,
pagination, groups, and CSV import/export, backed by a real Postgres
database.

The starter project you’ll download already includes the visual design —
colors, type, card and form styles — and an empty, styled placeholder for
every page the finished app will have. Your job across this course is to
turn those placeholders into a working application, one module at a time.

What’s already decided for you

  • Framework: Next.js 14, App Router, TypeScript
  • Database: Postgres, queried with plain SQL via the pg package — no
    ORM
  • Data flow: Server Components read data directly; Server Actions
    handle every write (create, update, delete, favorite, import)
  • Styling: already written, in app/globals.css — this course is about
    functionality, not CSS

What this module covers

  1. A tour of the starter project’s structure
  2. Connecting it to a Postgres database and running the schema
  3. Starting the dev server and confirming the empty shells render

By the end of this module, you’ll have a running app that looks styled but
does nothing yet — which is exactly where we want to start.