Getting Started with the Cooking App

Welcome to your first step in building the AI Cooking Helper! In this lesson, you will learn how to set up the foundation of your web application using TypeScript and Express, a popular web framework for Node.js. Express is lightweight, easy to use, and perfect for beginners who want to build web apps quickly with TypeScript.

By the end of this lesson, you will have a working Express project written in TypeScript, connected to a database. This setup is essential for storing recipes, user data, and more as you continue to develop your cooking app. Everything you learn here will be used in future lessons as you add more features and functionality.

Before we dive in, let’s quickly review how TypeScript projects are usually organized in a Node.js environment. A typical TypeScript project has an entry point file (like src/index.ts) that starts the application, and folders (like src/routes/ and src/) that hold different parts of the code, such as routes and database logic.

For example, your project might look like this:

cooking_helper/
├── src/
│   ├── index.ts
│   ├── config.ts
│   ├── db.ts
│   ├── routes/
│   │   ├── recipes.ts
│   │   └── tts.ts
│   └── ...
├── package.json
├── tsconfig.json
└── prisma/
    └── schema.prisma

• src/index.ts is where your application starts.
• The src/routes/ folder keeps your code organized by separating different route handlers.
• src/config.ts holds configuration values.
• src/db.ts manages the database connection.
• prisma/ contains your database schema if you use Prisma as your ORM.

This structure helps keep your code clean and easy to manage as your project grows.

Let’s start by creating a basic Express application in TypeScript. In your src/index.ts file, you will need to import Express and create an app instance.

import express from "express";

const app = express();

app.get("/health", (_req, res) => res.json({ status: "ok" }));

app.listen(3000, () => {
  console.log("Server listening on http://0.0.0.0:3000");
});

Here’s what’s happening:

• import express from "express" imports the Express library.
• const app = express() creates a new Express application.
• app.get("/health", ...) defines a simple route for checking if the server is running.
• app.listen(3000, ...) starts the server on port 3000.

You can add more configuration and middleware as your app grows. For example, to parse JSON request bodies, add:

app.use(express.json());