Travel Bae:
TravelBae is an online travel website that helps customers plan better trips to their favourite destinations. The application keeps track of the best destinations, hotels, and modes of transportation. Other features on the website include activities to do, itinerary management, bucket lists, and much more.
The Main Features of our application are:
- Destinations
- Bucket Lists
- Blog Management
- Transportation Options
- Accommodation options
- User Management
- Profile Management
- Activities to do
- Itinerey Management
- Dashboard
- Things to carry
- Trip Planner
- Install and enable this CORS extension to run the project on Heroku.
- Date Created: 16 June 2022
- Last Modification Date: 21 July 2022
- Git Repository URL: https://git.cs.dal.ca/maurya/csci-5709-project
- Heroku deployment URL for application: https://travel-bae.herokuapp.com/
- Nishit Mistry: https://git.cs.dal.ca/maurya/csci-5709-project/-/tree/nishit-mistry
- Trushita Maurya: https://git.cs.dal.ca/maurya/csci-5709-project/-/tree/trushita-maurya
- Smily: https://git.cs.dal.ca/maurya/csci-5709-project/-/tree/smily
- Smriti Mishra: https://git.cs.dal.ca/maurya/csci-5709-project/-/tree/smriti-mishra
- Hrishita Mavani: https://git.cs.dal.ca/maurya/csci-5709-project/-/tree/hrishita-mavani
- Sagramsinh More: https://git.cs.dal.ca/maurya/csci-5709-project/-/tree/sangramsinh-more
- Smily - (Maintainer)
- Trushita Maurya - (Maintainer)
- Nishit Mistry - (Maintainer)
- Sangramsinh More - (Maintainer)
- Hrishita Mavani - (Maintainer)
- Smriti Mishra- (Maintainer)
- React - Used for building the front-end.
- Material UI - To build responsive User Interface components - navigation bar, pagination and cards layout.
- React Router - Used to do the routing in the application (home and destinations) since react does not have anything in-built.
- NodeJS - NodeJS Used as Back-End (Server Side) Framework.
- ExpressJS - ExpressJS Used for Routing Purposes.
For the completion of this assignment, I have used the components provided by Material UI The components used are:
- App Bar
- Theming
- Grid
- Typography
- Box
- Form Group
- Checkbox
- Icon Button
- Tool Bar
- Card
- Grid
- Pagination
- Alert
- TextField
- Heroku - For deployment
- The application has been deployed on Heroku.
- To run this assignment on your local machine, you need the following software / libraries installed.
NodeJS
npm - Node Package Manager
-
Install and enable this CORS extension to run the project on Heroku.
-
git
Clone the repo, and run the following commands for installing the dependencies.
npm install
The following command will run the application on your localhost.
-
Clone git repo using
git clone https://git.cs.dal.ca/maurya/csci-5709-project.git -
cd client -
Install all dependencies using
npm install -
Start application in dev environment using
npm run start -
cd .. -
cd server -
Install all dependencies using
npm install -
Start application in dev environment using
npm run start
-
Install NPM packages.
npm install -
Authenticate heroku account via heroku CLI.
heroku login -
Create a new app on heroku.
heroku apps:create project-name -
Add heroku remote to the project.
heroku git:remote -a project-name -
Push the code on heroku.
git push heroku master
-
NPM - Nodejs package manager
-
Heroku - Cloud platform to deploy application
-
VSCode - IDE used for development
-
Gitlab - Repository and version control system
-
Postman - API testing software
-
Mongo DB - Tool used to check the collections and data on the database
All the images used for this project are royalty free.
- Reference for Images:
- Search.creativecommons.org. 2022. Openverse | WordPress.org. [online] Available at: http://search.creativecommons.org/ [Accessed: July 21, 2022].
[1] "The W3C Markup Validation Service," Validator.w3.org [Online]. Available: https://validator.w3.org/. [Accessed: July 15, 2022].
- Used to check if the deployed app is W3C compliant.
[2] "Cloud Application Platform | Heroku," Heroku.com [Online]. Available: https://www.heroku.com/. [Accessed: July 21, 2022].
- Used Heroku to deploy the application.
[3] "Getting Started – React", Reactjs.org [Online]. Available: https://reactjs.org/docs/getting-started.html. [Accessed: June 16, 2022].
- Used React documentation to to learn React.
[4] "Installation - Material UI", Mui.com [Online]. Available: https://mui.com/material-ui/getting-started/installation/. [Accessed: June 16, 2022].
- Used Material UI documentation to learn about different material UI components.
[5] Assignment-1 Git URL (Smily) - https://git.cs.dal.ca/smily/smily-csci5709-individual/-/tree/assignment1
[6] Assignment-1 Git URL (Hrishita Mavani) - https://git.cs.dal.ca/mavani/hrishita-mavani-csci5709/-/tree/assignment-1
[7] Assignement -1 Git URL (Trushita Maurya) - https://git.cs.dal.ca/maurya/csci-5709/-/tree/assignment1
[8] Assignment -1 Git URL (Sangramsingh More) - https://git.cs.dal.ca/smore/csci-5709/-/tree/assignment1
[9] Assignment -1 Git URL (Smriti Mishra) - https://git.cs.dal.ca/smishra/smriti-mishra-csci5709/-/tree/Assignment1
[10] Assignment - 1 Git URL (Nishit Mistry) - https://git.cs.dal.ca/nmistry/csci5709/-/tree/assignment1
- Some part of code is taken from first individual assignment referenced above.
[11] "Javascript regular expression password validation having special characters," StackOverflow.com [Online]. Available: https://stackoverflow.com/questions/12090077/javascript-regular-expression-password-validation-having-special-characters. [Accessed: June 16, 2022].
[12] "pagination hook react Code Example," Codegrepper.com [Online]. Available: https://www.codegrepper.com/code-examples/javascript/pagination+hook+react. [Accessed: July 10, 2022].
[13] M. parameter, "Mongoose query with array parameter," Stack Overflow [Online]. Available: https://stackoverflow.com/questions/26985908/mongoose-query-with-array-parameter. [Accessed: July 12, 2022].