Trawalrs

Trawalrs is a map-based memory app, consisting of:

• ExpressJS API
• MongoDB
• React app, using Material UI components, created with Vite

Prerequisites

Before running the app locally, you need the following:

• Git
• Node.js
• MongoDB (MongoDB Compass is suggested.)
  • A MongoDB server should run in the background locally.
  • Or you can just connect to MongoDB Atlas running on the cloud.
• Mapbox access token

Running the App Locally

1. Clone this repository:

   git clone https://github.com/yourusername/trawalrs.git

2. Go to project directory:

   cd trawalrs

3. Go to /server directory.

   Inside /server folder, create .env file and fill up the following environmental variables:

   DB_URL=mongodb://127.0.0.1:27017/trawalrs
   API_PORT=3131
   UPLOAD_DIR=public
   CLIENT_URL=http://localhost:3132
   SESSION_SECRET=<your-secret-key>
   SESSION_COOKIE_MAX_AGE=3600000
   MONGO_STORE_MAX_AGE=3600
   

   Use public value for UPLOAD_DIR variable. Otherwise, change public/ line inside .gitignore file.

   Then, run:

   • With nodemon:

   npm run dev

   • Or without nodemon:

   npm run start

   You must have a valid MongoDB connection to run the server.

4. Go to /client directory.

   Inside /client folder, create a .env file and enter your Mapbox access token. You can obtained it by a free sign-up on Mapbox

   VITE_MAPBOX_ACCESS_TOKEN=<yourMapboxAccessToken>
   
   

   Then, run:

   npm run dev

You are highly encouraged to set your own environmental variable values.

3. Access the Trawalrs at http://localhost:3132.

Usage

• Allow browser to know your location.

• Create an account using top-left user menu.

• Log into your acount.

• Search for a location.

• Double click where you want to put a Walr.

• Submit your Walr.

• View your Walrs on the map or list them using top-left menu.

• Toggle theme as you need.

Development TODO List

Last updated: 06-Oct-23

TODO	Work on	Status
Validate data models	server	✗
Login on registration	server	✗
Validate forms	client	✗
Profile view	client	✗
About view	client	✗
Better WalrList view	client	✗
Get rid of error message on page load without login	client+server	✗