Install Tools#

This is the first step before you can create a project.

You will need to install a development environment that supports compiling, testing and running your application. You will need the following:

• Git client
• node.js
• Vite
• Vitest

Git client#

Any recent version of Git can be installed, and it should be preinstalled on macOS and Linux systems. You can also download and install a Windows version from the main Git site.

node.js#

1. Install it from node.js. Check the box for extra tools to be installed, including choclatey.
2. Verify it worked using: node -v (if the version number is returned, then your environment is running as it should be).
3. Determine its location using: where node (the path should be returned).
4. Confirm that it is working using: node (prompt then changes to >), then console.log(“Hello from Node!”) (Hello from Node! should be printed).
5. After the node.js install, from the command line in Git Bash, (to get latest npm verion) run npm install -g npm@12.0.2 (version number will change in time, as suggested by the product itself).

Vite#

Instructions, Windows or Mac

The instructions below are summarized from the above, and capture what I did for my own Windows setup.

1. From Git Bash prompt, run: npm init @vitejs/app, and follow the prompts. (e.g. I created a project called sandbox with Vanilla settings, so replace this name below with your project name).
2. Once in Vite, use h for help.
3. cd sandbox
4. npm install

After this, to launch Vite:

1. cd sandbox
2. npm run dev (then you can view your site at: http://localhost:5173/)

Vitest#

Instructions, Windows or Mac

The instructions below are summarized from the above, and capture what I did for my own Windows setup.

1. Navigate to your local Vite folder.
2. npm install -D vitest
3. Add to .gitignore: .vitest/
4. Add to package.json
   1. There should already be a section called scripts
   2. Add this line at the end of that section, also adding a comma to separate the previous last item from this new last item: “test”: “vitest”
5. Download sum.js to your local Vite folder.
6. Download sum.test.js to your local Vite folder.
7. Download square-root.test.js to your local Vite folder.
8. Run all your tests: npm test
   1. The above will run all tests (.test.js) in your project.
   2. You can filter to a subset of the tests by specifying a name after “test”.

Last Word#