Homie - Angular Frontend

Angular frontend for HOMIE: an online rental accommodation platform for young professionals and international students who came to Egypt looking for apartment. We allow users to rent a unit as agents and they are also allowed to rent their units as landlords. A unit can be a whole apartment or just a room and you can filter the units to match what you want in a very specific way.
This repository is a part of our ITI graduation project. We are interns in the MEARN track and our project is built using Angular, MongoDB, Express and NodeJS. You can find all project repos here.

Source Code Organization

src: root of the source code
- app: angular application
  - models: models used in the application
    - signUp model
    - auth model
    - city model
    - contract model
    - favorite model
    - help question model
    - unit details model
    - unit review model
    - units model
    - user model
  - modules: angular modules
    - aboutUs modules: contain general information about Homie website
      - aboutUS components:
        
        aboutCover
        
        values
    - admin module: control website page
      - admin components:
        
        cities
        
        user
        
        help question
        
        review
        
        units
        
        contract
    - core module: contain fixed compnent in website
      - core components:
        
        footer
        
        navbar
    - contact-us module : contain ==> how to contact us?
      - contact-us components:
        
        contact
        
        online contact
    - home page module : contain home page website
      - home page components:
        
        about-us
        
        city-cards
        
        homie-cover
        
        homie-info
        
        homie-search
    - not found module : contain not found page ==>appear when there is error in website
      - not found components:
        
        not found
    - payment form module : contain the way to payment get way in Homie website
      - payment components:
        
        payment
    - help-question module :
      - help-question components:
        
        get all help question
        
        add help question
        
        edit help question
        
        delete help question
    - shared module : contain shared
    - units module : contain all units page & unit page & unit listing
      - units components:
        
        all units page :
        
        unit-card
        
        unit-filter
        
        unit-sorting
        
        unit page :
        
        landlords details
        
        rating
        
        unit description
        
        unit gallery
        
        unit info
        
        unit review
        
        unit page
        
        unit-listing
    - units crud module : contain crud opration for units
      - unit crud components :
        
        add unit
        
        edit unit
    - user module : contain any thing belong user
      - user components:
        
        registration pages
        
        activation-page
        
        forget password
        
        login
        
        sign up
        
        log out
        
        new password
        
        user account
        
        user profile page
        
        user-about
        
        user-card
        
        user unit listing
        
        user wishlist
  - services: services handling data flow
    - admin service
    - auth service
    - getdata service
    - transfer-data service
- assets: static assets ==>contain some static images
- environments: definition of production or test environment
- styles: CSS styles

Prerequisites

angular v4 or higher.
npm v6 or higher.
bootstrap v5 or higher.
fontAwosome.
NgxPaginationModule.
NgxSpinnerModule

Instructions

Clone the project

 git clonehttps://github.com/homie-iti/frontend.git



- Go to the project directory

 ```bash
   cd frontend

Install dependencies

   npm install

Screen shot

home page ==>
all units ==>
one unit ==>
Sign Up ==>
login ==>
contact us ==>
about us ==>
help question ==>

Features

filter units by ==> gender type , estate type , price range , pets allowed
search => cityName and find units in them
user => can be (landlord or agent)
Admin :
- user ==> add , delete , update ,get all
- unit ==> add ,delete , update , get all
- city ==> add , delete , update , get all
- review ==> add ,delete , update , get all
- contract ==> add , delete , update , get all
- help question ==> add ,delete , update , get all
account activetion
forget and reset password
check avaliablity
favorite list for every user

Color Reference

Color	Hex
--bg-lightGray	#cfc2b3
--main-font-color	rgb(34, 56, 63)
--hover-font-color	#988042
--main-background-color	rgba(234, 209, 179, 0.265)
--addresses-color	rgb(34, 56, 63)
--color-search	rgb(225, 216, 205)
--section-color	rgba(177, 163, 145, 0.459)

Authors

Used By

This project is used by the following companies:

-clients

HomieFrontend

This project was generated with Angular CLI version 14.0.6.

Development server

Run ng serve for a dev server. Navigate to http://localhost:4200/. The application will automatically reload if you change any of the source files.

Code scaffolding

Build

Run ng build to build the project. The build artifacts will be stored in the dist/ directory.

Running unit tests

Run ng test to execute the unit tests via Karma.

Running end-to-end tests

Run ng e2e to execute the end-to-end tests via a platform of your choice. To use this command, you need to first add a package that implements end-to-end testing capabilities.

Further help

To get more help on the Angular CLI use ng help or go check out the Angular CLI Overview and Command Reference page.

homie-iti / frontend