/devfest-hellas-2022

DevFest Hellas 2022 workshop: Introduction to modern web development with Angular

Primary LanguageTypeScript

Welcome to devfest-hellas-2022 👋

Version Twitter: abampakos

DevFest Hellas 2022 workshop: Introduction to modern web development with Angular

Demo

What we will build ⚒️

In this workshop, we will build an Angular application that interacts with the FakeStore API. The application will display a list of products initially. The user will be able to click on a product from the list and navigate to the details page of the selected product.

We will use the Angular Material library to add some really cool UI styles in the application and we will finally deploy it to GitHub Pages.

What tools we will need 📑

  1. Visual Studio Code: Download and install VSCode editor.

  2. Node.js: Download and install an LTS version of Node.js. To verify that you have installed it correctly type the command node -v in a command line window and it should display the installed version of Node.js

  3. Npm: It is already included in Node.js. To verify that you have it, type the command npm -v in a command line window and it should display the installed npm version.

    Windows users: if the previous command is not working, verify that the path of the npm executable has been added to your PATH environment variable.

  4. Git: If you do not already have Git installed, navigate to https://git-scm.com/downloads, download the appropriate version for your environment and install it.

Which Angular libraries we will use 🧩

  • Angular HTTP: A built-in HTTP client for communicating and interacting with APIs and remote endpoints
  • Angular Router: Enables in-app navigation and routing in an Angular application
  • Angular Material: A Material Design implementation for Angular applications

Install

npm install

Usage

npm run start

Author

👤 Aristeidis Bampakos