Dart Dev Hub

Examples

Dart Web App

Building a Dart Web App

Dart web app uses Shelf for server-side rendering.

Introduction to Dart Web Apps

Dart is a versatile programming language developed by Google, often used to build mobile, desktop, and server applications. In this post, we'll explore how to create a simple web application using Dart, with a focus on server-side rendering (SSR) using the Shelf package.

Shelf is a web server middleware for Dart that provides a simple and customizable way to manage HTTP requests and responses, making it perfect for web app development.

Setting Up Your Dart Environment

Before you start developing your Dart web app, ensure you have the Dart SDK installed. You can download it from the official Dart website. Once installed, verify the installation by running:

Next, create a new Dart project using the following command:

Navigate to the project directory:

Adding the Shelf Package

To use Shelf for server-side rendering, add it as a dependency in your pubspec.yaml file:

After adding Shelf to your pubspec.yaml, run the following command to install the package:

Creating a Simple Web Server with Shelf

With Shelf installed, you can now create a simple web server. Open the bin/main.dart file and replace its content with the following code:

This script sets up a basic HTTP server that listens on port 8080 and echoes the requested URL. It uses the Pipeline class to add middleware for logging requests.

Running Your Dart Web App

To run your Dart web app, execute the following command from your project directory:

Open a web browser and visit http://localhost:8080/. You should see a message echoing the URL you requested.

Congratulations! You've successfully set up a basic Dart web app using Shelf for server-side rendering.

Examples