Real estate

This project uses It was generated with Angular CLI

The application is available at the following addresses:

• https://ng-real-estate.web.app
• https://ng-real-estate.firebaseapp.com

Introduction

The application is built for the real estate sector. Current functionalities include browsing premises for rent and adding new premises with photos. The application is in the version for many resolutions.

Development server

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.

Further help

To get more help on the Angular CLI use ng help or go check out the Angular CLI README.

Tech

Real Estate uses the following open source projects for proper operation:

• Angular
• Angular CLI
• Angular Material
• Angular Flex-layout
• Angular Fire
• TypeScript
• node.js
• RxJS
• Scss

Some screenshots of the application

📱 Mobile devices:

The most important views on your smartphone.

The description of the views is below in the desktop version.

💻 Desktop:

Different views from the desktop.

👉 View of the "Premises" tab 👇

👉 "Premises" tab and user registration view. 👇

👉 Login view and creation of a new premises with form validation. 👇

👉 Continuation of the above with the display of inactive buttons. A correctly completed form on the right. 👇

👉 Adding photos to Firebase Storage using "Photo Drop Zone" or "Button". 👇

👉 Saving information about the premises and photos in the Firebase Database. 👇

👉 Adding photos to premises 👇

👉 Changing the buttons activity and displaying subsequent messages. 👇

👉 Usage "Photo Drop Zone" or "Button" to add photos to Firebase Storage and to Firebase Database. 👇

👉 Confirmation of saving data in the Firebase Database and logging out. 👇

👉 On the left: The logged-out user browses the premises of Mariusz, who has not added a photo yet. On the right: Login screen. 👇

👉 On the left: A user logged in as Robert browses Mark's premises. On the right: Robert's profile. 👇

👉 Editing a second contact and validating errors. 👇

👉 Saving the second contact. 👇

👉 View of the contact entered and change of the avatar. 👇

👉 When the logged-in user selects a previously added photo, the erase option will appear. 👇

👉 Deleting the selected photo. 👇

👉 View of the "Delete premises" tab. 👇

👉 Information about the number of photos of the premises and about the need to remove photos before deleting the premises. 👇

👉 Removal of premises after deleting photos. 👇

👉 Pre-edit view and view of the premises selected for editing. 👇

👉 Information about the premises on the left. On the right view of the editing window. 👇

👉 Editing the "Rented" field and after-editing premises view. 👇