The aim of this project is to set up an Angular web application that has authentication mechanism, can connect to a remote REST API and fetch data to the UI. This project was generated with Angular CLI version 11.1.3.
Development server
Run npm install to install all packages and dependencies this project has to your local machine.
Run ng serve for a dev server. Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.
Technologies and Packages
Firebase SDK was used for authentication.
Angular 11 was used for the UI development.
Chart.js library was used to generate chart components.
ngx-lottie package was used for json lottie handling.
JSONPlaceholder REST API was used for the dummy data.
UX design was created with 'Miro'.
UI design was created with 'Figma'
Workflow and Pages
On the route '/' user can login to the application. If user logins successfuly, it is redirected to 'dashboard' page.
On the route '/signup' user can signup to the application. If the user finishes signup process successfuly, the user will be redirected to login page.
On the route '/dashboard' which only authenticated users have access, there is a chart that displays the number of completed and uncompleted todos from https://jsonplaceholder.typicode.com/todos API endpoint.
On the route '/users' which only authenticated users have access, there is a list of users that are fetched from https://jsonplaceholder.typicode.com/users API endpoint. Also, there is a section that displays the selected user.
About
A basic Angular application with JSONPlaceholder REST API.
