davidtorroija / angular-marketplace

angular-marketplace

Angular Marketplace

To run the app:

• Make sure you have Angular 12
• Move to the client folder and run: ng serve

The following image shows the frontend architecture of the project and the dependencies between modules

app.module

• Eager load before app starts.
• It bootstrap app.component
• Imports core.module

app-routing.module

• Lazy load in /auth route the auth.module
• Lazy load in / route the layout.module

auth.module

• Imports all login related components (login page, reset password, register, etc)

auth-routing.module

• Define all auth related routes related to /auth parent route (/login, /register, /forgot, etc)

layout.module

• Imports layout.component and all components related like: header.component, footer.component, etc
• Also imports others features modules commonly like user.module.

layout-routing.module

• Lazy load features modules which no other module depends, like product.module, cart.module, etc

core.module

• Imports components, guards, interceptors, services, constants, enums, models, utils and any other class that are considered as global.

shared.module

• Imports component, directives and pipes.
• The shared module not depends on any other module.

features modules

• It contains services only related to the module
• It could contians any class that is going to be refered only for this feature, that could be:
  • services
  • models
  • components
  • layout components related to it (subviews). A good example could be a modal.

angular-marketplace's Issues

Create angular boilerplate

As a developer, I want to build the basic steps
So that I will start coding this app

Scheme API to DB queries

As a developer I want to establish a scheme for a practical and secure connections to the MongoDB
So that I will have a organized and simple squeme to construct the queries and connections from the API services

Game detail page

Create the auth module

As a developer I want an auth module which will only contain logic related to the authentication
So that we can have a well organized scheme according the bussines logic.

Also create the Shared and Code modules.

Create NestJS structure for Backend

Configure and Secure API calls

As a developer, I want to have a defined scheme already configured to secure all calls
So that I will replicate in all the subsequent calls to the API

Create a first design proposal

• Angular material configuration added

• Predifined with the team several design models

• Basic structure of the project defined

Create Layout Module in Angular

As a developer I want a layout module to only contains navigation components and routes in the main page after login
So that we can have a well organized scheme according the bussines logic

Create the products module

As a developer i want a product module, displaying the product cards with routes to each product detail page, so that we can have a initial ecommerce view

Created branch AMP-ProductsModule

This is an initial approach
https://www.screencast.com/t/lZab2EuiN

-To define

1. Marketplace theme
2. Navabr Items
3. Cart view in the drawer

Which libraries are we going to use on the client?

As a developer I want to know which libraries are we going to use so that we can be prepared we the time for DAT comes.

From what I saw on DAT, they use the material design components for Angular: https://material.angular.io/
That would be one which I think we surely have to use.

Maybe we can ask Julio or Camilo to know some of the things that they use. What do you think? @davidtorroija

Create an express server for repo

As a developer I want a express server to interact with the angular front end app
So that I will connect to the mongo DB using REST Api

Connect server with mongo DB

As a developer I want to create a connection between the server and mongoDB with all the securities involved, so that I will securely start creating queries to the DB through res API calls

Create Mongo DB container

As a developer, I want to create dockerized Mongo
So that it will be a portable solution for the developing process

Create a README file for DB and Backend

As a developer I want a compressive README file in the root to explain how to run docker-compose with the necessary services to locally run the DB and the EXPRESS server. So that any other team memeber can easily knows how to perform this tasks and start developing quickly.

Testing issue

Styling Navbar

--Top navigation added
https://github.com/davidtorroija/angular-marketplace/tree/AMP-26_StylingNavbar