UI Patterns and Practices - Part 1

Running the demos

Angular

npm install
npm run start

React

npm install
npm run start

---Or---

yarn
yarn start

Vue

npm install
npm run serve

---Or---

yarn
yarn serve

Setting up the projects from scratch

Angular

• Install the Angular CLI. npm install -g @angular/cli
• Create an Angular app. ng new angular-demo
• Change to new directory. cd angular-demo
• Install Angular Material. npm install --save @angular/material @angular/cdk @angular/animations
• Configure fonts and icons. https://material.angular.io/guide/getting-started

React

• Create React app. npx create-react-app react-demo
• Change to new directory. cd react-demo
• Add react router. npm install --save react-router-dom
• Add Material UI. npm install @material-ui/core
• Configure fonts and icons. https://material-ui.com/getting-started/installation/

Vue

• Install the Vue CLI. npm install @vue/cli -g
• Create a Vue app. vue create vue-demo
• Change to new directory. cd vue-demo
• Add Vuetify. vue add vuetify