2:32

Part 7 of 10

The Project Environment

0

Install VS Code and Elements, build a todos app by asking an AI agent, and deploy the app to DigitalOcean. Then tour the project environment, the elements command, the website and the business.

  1. 1. Introduction 0:18
  2. 2. Install VS Code 3:30
  3. 3. Install Elements 1:27
  4. 4. Create Your First App 5:26
  5. 5. Set Up a Deployment Environment on DigitalOcean 4:49
  6. 6. Deploy Your App 3:11
  7. 7. The Project Environment 2:32
  8. 8. The Elements Tooling 6:07
  9. 9. The Elements Website and Community 2:48
  10. 10. The Elements Business 1:27

In this video we look at where an Elements project lives, how to reopen a project in VS Code, how to start the day with elements start, and how to work on a project from the terminal.

1. A project is a folder

An Elements project is a folder on your computer. By default it is in your home directory at ~/elements/projects/<name>. Open that folder in Finder on a Mac, or File Explorer on Windows, to see the project's files.

2. Reopen a project

When you open VS Code the next day, it opens the project you were last working on.

To open a different project, choose File > Open Recent and pick the project. If the project is not in the list, choose File > Open Folder and open the project's folder.

3. Start the day with elements start

The first time you open a project in a day, the app is not running and the browser tab in VS Code shows an error. Open a terminal with Control-backtick, or Terminal > New Terminal, and type:

Terminal
elements start

The app server starts in a moment, and the app appears in the browser tab.

4. Ask the agent

When you are not sure how to do something, ask the agent in the chat. It already knows about Elements, so it can answer questions such as how to start the server.

5. Work from the terminal

Elements is a folder and a command-line program, so you can also work from a terminal of your own:

Terminal
cd ~/elements/projects/myapp ls

Start an agent in the project folder, such as Claude Code, and it knows about Elements and the project:

Terminal
claude

Or open the folder in Vim or another editor. The Elements language server gives you the same editor features you get in VS Code.

You don't need the terminal to use Elements. The videos use VS Code, which is a good environment for building these apps.

Add a comment