reactSLS

UCLA Extension Coding Bootcamp Project 3

To view deployed version, click here!

General Overview - Senior Living Services is an assisted living referral company. Our client helps families find assisted living homes for their loved ones.

See how it works:

Basic Instructions

The target Client/User for this website is someone looking for a specialized facility for their loved one in need of care. Once the 'User' fills out the form 2 important things happen. 1 - The User receives info about a variety of facilities for a loved one in the location of their choice. 2 - Once the results are displayed, the info entered becomes a 'Lead' for the Owner which goes into a database. Users can also find out about the company through the info displayed and reach out to the owner directly. In addition there is a section for the Admin/Owner.

More about the project:

Our client needed a website that provided a portal where visitors and potential clients can search for facilities in their area as well as learn more about the services our client provides. So we decided to polish the working application by using React.js and MongoDB. We also added a method of lead generation for the business owner by collecting user data and storing it to a database only accessible by an administrator.

Comments - The reactSLS App demonstrates CRUD, four basic functions of persistent storage, using MongoDB within a REACT built application.

New Technologies Used in addition to project requirements

• express-hogan - https://www.npmjs.com/package/express-hogan

Hogan.js is a compiler for the Mustache templating language.

Other npm's used:

• express-generator4
  
• babel-core
  
• babel-preset-react
  
• babel-preset-es2015
  
• Webpack
  
• webpack-dev-server
  

Future additions:

-nodemailer for the contact form
-Admin section improvement with authentication and database display
-google pages Excel link for admin section

Website & Project history:

Original site:
(www.seniorlivingservice.com )

Project 2 - 'MVC':
(project 2 link: https://seniorlivingservice.herokuapp.com/)

Project 3 - Refactored w/ React Components
(project 3 link: https://slsreact.herokuapp.com/)

NPM Packages

The NyTimes React App uses the following NPM packages:

• axios NPM Package - https://www.npmjs.com/package/axios
• node.js - https://nodejs.org/en/
• react NPM Package - https://www.npmjs.com/package/react
• react-dom NPM Package - https://www.npmjs.com/search?q=react-dom
• react-router NPM Package - https://www.npmjs.com/package/react-router
• body-parser NPM Package - https://www.npmjs.com/package/body-parser
• express NPM Package - https://www.npmjs.com/package/express
• heroku-cli NPM Package - https://www.npmjs.com/package/heroku-cli
• mongoose NPM Package - https://www.npmjs.com/package/mongoose --and many more

Technology list

• Npm

• Node.js

• Axios

• MongoDB

• Babel

• Mongoose

• Express

• React

• React-Dom

• Google API

• Bootstrap

• HTML5

• CSS

• jQuery

• node-mailer

• Handlebars-react

        Copyright 2018 by (Bytemedia Team)
  

  Ulysse Hakizimana, George Raymond, Kayhon Ahankoob
  @UCLA Extension Coding Bootcamp