Pick-and-Go

An awesome website to help you plan a trip!
Explore the website »

Table of Contents

Click me

1. About The Project
   • Overview
   • Demo
2. Built With
   • Front end
   • Back end
   • Unit test
3. System architecture
4. Database relationship diagram
5. Run locally
   • Front end
   • Back end
   • Unit test
6. License
7. Contact

About The Project

Overview

Traveling is a ubiquitous part of human life, offering a chance to unwind and recharge. However, planning a trip thoroughly can be quite challenging. I've often wished for a tool that could streamline the planning process, so I've taken it upon myself to create one.

This project is a "Travel Planning Website" developed using front-end and back-end technologies. Users can share their travel experiences, save and like attractions posted by others, and use these attractions to plan their trips. Additionally, users can find travel companions through the website.

I've completed the essential features that I designed for the project, but it's still in its early stages of development. Therefore, feel free to share any feedback or suggestions you may have. I hope you enjoy using it!

Demo

With this website, you can:

• Share your memorable experiences from trip spots, such as exquisite restaurants or scenic viewpoints.

• Search and save spots shared by others.

• Utilize the spots you've saved or created to craft new trip plans.

• Duplicate trips shared by others.

• Find potential trip partners.

(back to top)

Built With

Front-end

• React - Frontend framework for creating user interfaces
• React-Router-dom - Routing & navigation
• Bootstrap - User interfaces libraries

Back-end

• Node.js - Runtime environment for JS
• Express.js - Node.js framework for building RESTful APIs
• MongoDB-Atlas - Multi-Cloud Database Service
• Mongoose - MongoDB object modeling tool designed to work in an asynchronous environment
• Passport.js - Authentication middleware for Node.js
• Passport-google-Oauth2.0 - Authenticating with Google using the OAuth 2.0 API
• Passport-JWT - Aauthenticating with a JSON Web Token
• Bcrypt.js - Library to help hash passwords
• Joi - Schema description language and data validator for JavaScript
• Multer - Middleware for handling image uploaded
• Imgur - Third-party API for saving image
• Redis - In-memory database for server side cache and rateLimit
• Object-hash - Generate hashes for query

Testing

• Mocha - JS test framework for quality assurance
• Chai - Assertion library
• SuperTest - JS library for testing RESTful APIs

(back to top)

System architecture

(back to top)

Database relationship diagram

(back to top)

Run locally

This is an example of how to list things you need to use the software and how to install them.

1. Clone this project to your local enviroment.

git clone https://github.com/Samuel-Fan/Pick-Go-project.git

Front end

1. Move to client folder

cd client

2. Install required packages

npm install

3. add an .env file in the client folder

touch .env

4. Set enviroment variable

REACT_APP_API_URL='http://localhost:<Your server port number>'

5. Run it

npm start

Back end

1. You need to get your Imgur APi key.

2. You need to get GCP auth2.0 key if you want to use Google Authentication.

3. You need to get your Redis key. (https://app.redislabs.com)

4. Move to server folder

cd server

2. Install required packages

npm install

3. add an .env file in the server folder

touch .env

4. Set enviroment variable

MONGODB_URL= <Your MongoDB URL>
GOOGLE_CLIENT_ID=
GOOGLE_CLIENT_SECRET=
REDIRECT_URI='http://localhost:<Your client port number>'
SERVER_URI='http://localhost:<Your server port number>'
IMGUR_CLIENTID=
IMGUR_CLIENT_SECRET=
IMGUR_REFRESH_TOKEN=
IMGUR_ALBUM_ID=
REDIS_PASSWORD_USER=
REDIS_PASSWORD_OTHER=

5. And you have to set redis client in '/server/src/config/redis.js'

const redisClient_user = createClient({
  password: process.env.REDIS_PASSWORD_USER,
  socket: {
    host: <Your host String>,
    port: <Your port>,
  },
});

6. Run it

npm start

Unit test

1. You have to run the server first

cd server
npm start

2. Run test

npm test

(back to top)

License

MIT license

(back to top)

Contact

Email - [email protected]
Linkedin: linkedin-url

Project Link: https://github.com/Samuel-Fan/Pick-Go-project
Website Link: https://pickgo.site/

(back to top)