Frontend ReactJS Development of Web Application for US Real Estate Agency

checklist
  • Duration: 3 months
  • Industries: E-Commerce
  • Services: Backend Development; Frontend Development; Manual Testing Services; Software Integration Services
  • Software Categories and Types: B2C Solutions
  • Technical Expertise: Web Development
  • DevOps Expertise: Advanced build organization
  • Technologies: Bootstrap (Twitter Bootstrap); Git; Safari; AJAX; Project Management, Collaboration and Bug Tracking; HTML5; IntelliJ IDEA; JetBrains WebStorm; ReactDOM; Frontend; BitBucket (Stash); LESS; CSS; Operating Systems; ReactJS; React Router; JavaScript; JavaScript Frameworks; MacOS; IDE; Redmine; Build and Dependency Platforms and Tools; jqGrid; React Redux; CSS Frameworks; React Google Map; Source Code Management (SCM); React Scripts; jQuery; CI/CD and DevOps; React Bootstrap Multiselect; npm; APIs; Languages, Protocols, APIs, Network Tools; Network Tools; React Plugin; Software Engineering and Management Tools; Other Technologies; React Simple Popover; LinkedIn Authentication API; React Responsive Carousel; Simple-React-Month-Picker; Firebug; Google Maps API
project-team
  • Team size (3):
  • 1 Project Manager
  • 2 Frontend

Project summary

Web service for advertisements for sale of real estate is an application that allows customers and sellers of real estate to find interesting offers and make deals. Main application functionalities are:

  • Sign in and login of users (including sign up with LinkedIn).
  • Search for ads by specific criteria and areas of the geographical map (Google Maps).
  • Adding and editing of real estate objects.
  • Personal cabinet with several user roles (customer, seller, administrator).

The application consists of the server and client parts. The client part is a web application implemented using the React framework and its various plugins. Adaptive layout is implemented using Bootstrap as the CSS framework and LESS as styles language. The server part is a set of REST services.

The team performed layouts, integration with the server part using REST API, development of logic for data output and data input forms.

Technologies

Instruments: GIT, BitBucket, Redmine, JetBrains WebStorm.

Web & JavaScript: React, HTML5, CSS, LESS, Bootstrap, jQuery, AJAX, npm.

React plugins: react, react-bootstrap-multiselect, react-dom, react-google-map, react-redux, react-responsive-carousel, react-router, react-scripts, react-simple-month-picker, react-simple-popover.

External API: LinkedIn Authentication API, Google Maps API.

Screenshots

Project features

  • Communication and collaboration with territorially distributed teams.
  • An iterative approach to development was applied: Scrum/Agile methodology, daily internal meetings, weekly demo to the customer, using Redmine for project management and reporting.
  • Development of the frontend part of the application was implemented from scratch.

Project results

The customer was delivered the frontend part of the application, implemented in accordance with all incoming requirements.

Software development

Company’s achievements during the project

  • Deeply customized functionality of Google Maps was studied and implemented in the context of the React framework.
  • In addition to the frontend development, our team was involved in doing some server tasks, in particular, describing the REST API methods.
  • Our team offered several ideas for improving layouts, many of them were accepted by the customer.
  • Some React components initially were not equipped with sufficient functionality, that’s why they were improved by our team.
  • The team resolved the conflict of two Bootstrap plugins: one of them was replaced by an alternative customized component.

Articles based on the project experience

Adaptive website layout: the overview of approaches and CSS frameworks

Related projects

By industries:E-Commerce

Recent Work

    Contact Us

    What happens next?
    • 1

      Leave your project request. We will contact you and schedule a call.

    • 2

      Signing of the NDA to ensure the project info confidentiality.

    • 3

      Negotiation of your request and the required services.

    • 4

      Team forming, coordination of workstages.

    • 5

      Contract signing and project start.