Full Stack Home Inspection App built to streamline the creation and management of home inspections
-
Reverse Proxy — NGINX server with custom cache stores, CORS configuration, and subrequest authentication, it is used to integrate multiple services
-
Dashboard — Created using React using functional components, hooks, MaterialUI, and Socket.io. It allows users to create predefined inspection templates, manage inspections, create dynamic PDF reports, manage inspection photos (with markup, cropping), files, contacts, and emails. This dashboard features creating shareable links to share private data with clients. The UI is suitable for mobile devices. The dashboard runs on http://app.localhost
-
Public Portal — Uses Next.js static and server side rendering. This is the portal that sits in front of the public internet and is used by clients and visitors. The portal uses server side rendering to validate shareable links shared by the inspectors via the dashboard service. The public portal runs on http://localhost
-
Backend — Created using Node.js with Express.js, features auth/access controls, http cookies, logging using winston, and rate limiting. This backend interacts with a postgres database using pgpromise. It uses the sharp library to optimize image loading and compression, pdftk, handlebars and email-templates to create dynamic pdf and email templates. Postgres database queries are greatly optimized using a system of abstraction and reuse.
-
Postgres Database - Uses full text search, access controls and support for multiple users (inspectors), and stores a wide variety of data (AWS S3 urls, Cloudfront urls, SES, SNS data).
This is a sandboxed demo of a slightly bigger production app currently in use. For the purposes of a reasonable demo, this sandbox has a few limitations. It uses a single docker compose file, a single proxy server, logging, and uses localstack to mimic a subset of AWS services for offline use.
Since the docker images have been pushed to the docker hub, you need only docker compose, and the following 4 files: dev.env, demo, base.yml, demo.yml.
These 4 files have been added to the demo branch.
git clone --single-branch --branch demo git@github.com:parbhatia/ptr-app-demo.git
./demo start
Navigate to http://app.localhost for the dashboard.
Credentials are:
username: demo@demo.com
password: password
http://localhost is the default public portal for the static website.
This is the server side generated link that will get sent via emails from the dashboard service: http://localhost/Shared/${unique_shareable_link_id}
Dashboard
|
Page templates
|
Customizable text store
|
Photo markup / crop / caption
|
Dynamic PDF Report generation
|
Shareable link control
|
Email / Contact Management
|
Shareable link on public domain
|
If you want to build the docker images yourself, you need to clone all files from the main branch.
View the instructions in the ./demo script, to edit the BASE_YML_FILE and DEV_YML_FILE parameters.
Since the backend docker image compiles libvips and libheic, it might take around 5-10 minutes.
After that, it's the same command to start.
If you decide to deviate from the ./demo script and try to docker-compose up ... yourself, make sure you take steps to run the aws_init() function, because otherwise, data won't be initialized in the localstack container.
This is a project that I found to be incredible enjoyable to make. I spent a lot of time designing, and redesigning the database schema, api routes, front end ui/ux (coming from a very limited ui/ux background) and making use of computer science principles i’ve learnt over the years. I read in depth sql textbook chapters just to optimize queries that I felt could be optimized to a large degree. The concept of reusability is central in this stack; specifically, it is complimented by the reuse of react components, abstracted reusable sql query functions, and in the dynamic pdf template creation that happens during runtime.
The overall structure of the inspection report, the pages, categories, checkboxes, text store, the ability to drag items where appropriate, is designed after careful analysis, real world usage, and how the data would translate to PDF. Some aspects of the software were created based primarily on specific business needs. There's alot that can be easily customized in this app to suit your needs. The end result is an app that cut down the time of everyday business tasks that took up to 2-3 hours daily, down to 10-15 minutes, and vastly streamlined communication between home inspectors with their clients.
I created this app because the home inspection software that exists in the market is convulated, has expensive subscription models, shady privacy policies, outdated ui/ux, doesn't allow contact/email management, and offers limited customization.
If you have any issues regarding deployment, or any feedback for this full stack app, please reach out. I would love to hear what you think.
MIT License