Getting started - prerequisites

Welcome to SeqFlow getting started!

Here you can find the basic concept of the framework and how it can help your development. If you looking for a deep analysis about the reason, there's a dedicated page here.

Are you looking for more complex examples? Check the examples page.

Project creation

The first step to start a new project is to create it using the CLI. The command is:

pnpm create seqflow@latest --template empty

This command will ask you some questions about the project, like where to place the project.

For the purpose of this documentation, we will use the empty template, but you can choose another one running the previous command without --template empty argument.

Opening the project folder, you may see some files and folders. The most important are:

• src/index.css: the main CSS file
• src/index.html: the main HTML file
• src/index.ts: the entrypoint file
• src/Main.tsx: the parent component
• package.json: the dependencies and devDependencies are fulfilled
• biome.json: the project formatter configuration
• vite.config.js: the Vite configuration file
• vitest.config.ts: the Vitest configuration file. We will talk about it later
• tests/index.test.ts: the test file. Test part is covered at the end of this page

For now, we will focus only on src/Main.tsx file. You can split the file content into multiple files, but for this example, we will keep everything in the same file, for copy-paste reasons.

Run it locally

Before we start, let's install the dependencies. Run the command pnpm install to install the dependencies.

Let's start the application and see the result. Run the command pnpm start.
Open your browser and go to http://localhost:5173. You should see a blank page with the text "Hi!".

## Conclusion

In this tutorial, we have learned how to create a simple application using SeqFlow and how to run it locally.

Anyways, we are not done yet. Let's move on: our goal is to write an application that shows random quote fetched from an endpoint.