We will be building out the beginning of two applications a customer portal and an admin portal.
Nx workspaces diagram
1. Create a new Nx workspace in your workshop folder
Run the below command in a terminal to make a new nx workspace.
Answer the questions as shown to create a blank workspace named demo-app that uses the nx CLI. The output will look something like this:
2. Examine the output of the following files and commit code to git source control
Change directories into the newly created workspace and run the following command to open the new nx workspace in VSCode.
Inspect the following files:
workshop.json
nx.json
tsconfig paths
package.json
3. Create a new app
Since the new NX workspace has no apps or libs yet. You can run the below command to see the extra options to make an app or a lib besides the normal angular CLI commands.
Install the Angular schematic needed to create an Angular app.
Create a new app by running the below command in the terminal in a directory of your choice. Choose SASS as your stylesheet language.
4. Examine angular app and module structure
app.module.ts
tsconfig paths
package.json
apps and libs folders are empty
5. Run the app in the Chrome browser
Run the following command to launch the app in the browser. -a is for the app to start.
6. Commit your code
It is best to commit often when using the code generation tools so you can easily undo if it is not correct.
VS Codes Source Control Panel
7. Install WIP Workshop Code in a different folder
