Car World is a family friendly fullstack web application that challenges users in their game driving ability. This application includes a full gamut of features including everything from authentication, public high score board, and collision detection of moving objects.
Login Credentials
USERNAME: guest
PASSWORD: 1234
Full-Stack Web application that profiles game logic and collision detection using React and Ruby on Rails API. Frontend code located in this Github Repository. RESTfully persists user data with postgreSQL database via Active Record implementing a many to many model relationship along with full CRUD actions.
- Architectural considerations of building a full stack app with collision detection and game logic.
- Connect a front-end Create-React-App server to a Ruby on Rails backend
- Communicate data via RESTful API from the PostgreSQL database to the Client React Application
- Understand how to route user requests on the front end with React Router and on the backend with Active Record
- Enhance authentication flows in the app with the Ruby gems Bcrypt & JWT for Authentication
🌖Front-End
- React.js, React-Router-Dom
- JavaScript, ES6
- Semantic-UI-React
🌘Back-End
- PostgreSQL Database
- Served by Puma
- Active Record has a "many-to-many" database Schema
- Ruby, Ruby on Rails
- Rack CORS for handling Cross-Origin Resource Sharing (CORS) and AJAX
- Byebug and Pry-Rails used in Debugging Development
🚀Deployment
- Ruby on Rails API hosted on Heroku
- React hosted on Github Pages
🔨 Installation
$ git clone git@github.com:bavarianrhino/mod-4-backend-final-project.git
$ cd mod-4-backend-final-project
[server]$ bundle install
[server]$ rails db:create
[server]$ rails db:migrate
[server]$ rails db:seed $ git clone git@github.com:bavarianrhino/mod-4-frontend-final-project.git
$ cd mod-4-frontend-final-project
[server]$ npm install🔨 Running the application
- To serve the Ruby on Rails API navigate to the backend directory and execute command
[server]$ rails s- To start the client side of the application, open a different tab within a terminal. Navigate to the frontend directory and execute command.
[client]$ npm start- Host front and backend