Bara is a Yelp-inspired single-page web app where users can CRUD businesses and reviews. It is built with React.js, Redux, Ruby on Rails, and a PostgreSQL database.
4/19/2020 v2.0 Updating Rails
- Updated Ruby, Rails, and Paperclip (diff)
- Updated the stack from heroku-16 to heroku-18 for better support down the road
4/2/2018 v1.0 Refactored homepage
I have completely refactored the frontend React code for the homepage (Take a look! Here is a Medium story about the process). Compared to the original version, now the code is easier to read, has no ESLint errors, and we have some snapshot tests (
npm test). However, in the foreseeable future, it's unlikely that I will have time to keep improving this project.
- Each React component loads data from the backend based on URL, not from the Redux store, therefore the user can directly visit a specific page by its URL (the business search page with certain filters or the business show page of a particular business), and users can share pages by their URLs.
- Businesses can be searched by its name, address, city, state, zipcode, price range, tags, and their combinations.
- When logged in, a user can create/update/delete businesses and reviews. For demonstration purposes, there are no constraints for operations on businesses, i.e. any user can add businesses and edit/delete any existing businesses. (In reality, you probably do not want to allow that!) On the other hand, a user can only review a business once, and only the author is allowed to edit/delete a review.
- The business form fetches the latitude and longitude based on address using the Google Maps Geocoding API.
Development on localhost
- Make sure you have Ruby, Node.js, and PostgreSQL installed on your machine.
- Install dependencies.
gem install bundler(if you see open ssl errors, try
brew switch openssl 1.0.2sref)
- Setup the database.
- For local development, download and run PostgreSQL on your local machine.
bundle exec rake db:setup
- We use gem Figaro to get AWS credentials from
config/application.yml. The file is ignored by git, so that the credentials are not uploaded to GitHub. We use AWS S3 to store user avatars.
s3_region: "region" s3_access_key_id: "ABCDEFG" s3_secret_access_key: "12345678" development: s3_bucket: "dev" production: s3_bucket: "prod" GOOGLE_MAPS_API_KEY: "AIzaSyB42USxCYSP5SVIAjZz3hGSmWglUma3zok"
- Turn on the Rails server in a terminal window:
- Turn on webpack watching in a second terminal window:
- Now you can modify your frontend files, save them, wait for webpack to update the bundle file, then refresh you browser to see the changes.
- Overview and Details
- Frontend: React Component Hierarchy and Routes
- Frontend: Redux Sample State
- Backend: Rails API Endpoints
- Database: Schema