Final Project - Trippio - Gabriella, Asako & Sandra

.gitignore

@@ -2,14 +2,14 @@ node_modules
 .DS_Store
 .env
 .env.local
-.env.development.local
+.env.development
 .env.test.local
-.env.production.local
+.env.production
 
 build
 
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
 
-package-lock.json
+package-lock.json

README.md

@@ -1,13 +1,32 @@
-# Final Project
+# Trippio ✈️ - A social travel planner app
+Trippio is a fullstack travel planning web application where users can discover destinations, build and manage trip itineraries, and connect with other travellers. The project is built as a complete fullstack application with authentication, authorization, social features, and rich media support through custom image uploads and dynamic destination photos.
+The frontend is built with React and TypeScript and communicates with a RESTful backend API to handle authentication, trip management, image handling, and social interactions in real time.
 
-Replace this readme with your own information about your project.
+# Live Site: https://trippio.netlify.app/
 
-Start by briefly describing the assignment in a sentence or two. Keep it short and to the point.
+## Tech Stack
+### Frontend
+- React
+- TypeScript
+- Zustand for Global State Management
+- Tailwind CSS
+- REST API Integration
 
-## The problem
+### Backend
+- Node.js & Express
+- MongoDB
+- Cloudinary (image storage)
+- Unsplash API (destination imagery)
 
-Describe how you approached to problem, and what tools and techniques you used to solve it. How did you plan? What technologies did you use? If you had more time, what would be next?
 
-## View it live
-
-Every project should be deployed somewhere. Be sure to include the link to the deployed project so that the viewer can click around and see what it's all about.
+## Features
+- Search and browse travel destinations
+- Create, edit, and delete personal trip itineraries
+- Upload custom trip images or fetch curated destination photos via Unsplash
+- Images stored and served via Cloudinary
+- Share trips publicly with other users
+- Follow other users and explore their trips
+- View and edit your personal profile
+- Sign up & log in with persistent sessions
+- Responsive design across desktop and mobile
+- Error handling and loading states

backend/.gitignore

@@ -0,0 +1 @@
+.env

backend/express.d.ts

@@ -0,0 +1,12 @@
+import { User } from "./models/User";
+import "express-serve-static-core";
+
+// Extending the Request type to also include user (for TypeScript)
+declare module "express-serve-static-core" {
+  interface Request {
+    user?: User;
+  }
+}
+
+
+export { }; 

backend/middlewares/authMiddleware.ts

@@ -0,0 +1,34 @@
+import { User } from "../models/User";
+import { Request, Response, NextFunction } from "express";
+
+
+export const authenticateUser = async (req: Request, res: Response, next: NextFunction) => {
+  try {
+    const authHeader = req.header("Authorization");
+
+    if (!authHeader) {
+      return res.status(401).json({
+        message: "Missing Authorization header",
+      });
+    }
+
+    const accessToken = authHeader.replace("Bearer ", "");
+
+    const user = await User.findOne({ accessToken });
+
+    if (!user) {
+      return res.status(401).json({
+        message: "Authentication missing or invalid",
+      });
+    }
+
+    req.user = user;
+
+    next();
+  } catch (err) {
+    res.status(500).json({
+      message: "Internal server error",
+      error: err instanceof Error ? err.message : String(err)
+    });
+  }
+};

backend/middlewares/optionalAuthenticateUser.ts

@@ -0,0 +1,25 @@
+import { User } from "../models/User";
+import { Request, Response, NextFunction } from "express";
+
+export const optionalAuthenticateUser = async (req: Request, res: Response, next: NextFunction) => {
+  try {
+    const authHeader = req.header("Authorization");
+
+    if (!authHeader) {
+      return next();
+    }
+
+    const accessToken = authHeader.replace("Bearer ", "");
+
+    const user = await User.findOne({ accessToken });
+
+    if (user) {
+      req.user = user;
+    }
+
+    next();
+
+  } catch (err) {
+    next();
+  }
+};

backend/models/CityImage.ts

@@ -0,0 +1,19 @@
+import mongoose, { Schema } from "mongoose";
+
+const cityImageSchema = new Schema({
+  city: {
+    type: String,
+    required: true,
+    unique: true,
+    trim: true,
+    lowercase: true
+  },
+  images: [
+    {
+      type: String,
+      required: true
+    }
+  ]
+});
+
+export const CityImage = mongoose.model("CityImage", cityImageSchema);

backend/models/Trip.ts

@@ -0,0 +1,65 @@
+import mongoose, { Schema } from "mongoose";
+
+const activitySchema = new Schema({
+  name: {
+    type: String,
+    required: true
+  },
+  description: String,
+  category: String,
+  time: String,
+  googleMapLink: String
+});
+
+
+const daySchema = new Schema({
+  dayNumber: {
+    type: Number,
+    required: true
+  },
+  activities: [activitySchema]
+});
+
+
+const tripSchema = new Schema({
+  tripName: {
+    type: String,
+    trim: true
+  },
+  destination: {
+    type: String,
+    required: true
+  },
+  description: {
+    type: String,
+    default: ""
+  },
+  imageUrl: {
+    type: String,
+    default: ""
+  },
+  isCustomImage: {
+    type: Boolean,
+    default: false
+  },
+  days: [daySchema],
+  creator: {
+    type: mongoose.Schema.Types.ObjectId,
+    ref: "User",
+    required: true
+  },
+  isPublic: {
+    type: Boolean,
+    default: true
+  },
+  starredBy: [
+    {
+      type: mongoose.Schema.Types.ObjectId,
+      ref: "User"
+    }
+  ]
+},
+  { timestamps: true }
+);
+
+export const Trip = mongoose.model("Trip", tripSchema);

backend/models/User.ts

@@ -0,0 +1,47 @@
+import mongoose, { Schema } from "mongoose";
+import crypto from "crypto";
+
+const userSchema = new Schema({
+  userName: {
+    type: String,
+    required: true,
+    unique: true,
+    trim: true,
+  },
+  email: {
+    type: String,
+    required: true,
+    unique: true,
+    lowercase: true,
+  },
+  password: {
+    type: String,
+    required: true,
+  },
+  bio: {
+    type: String,
+    default: "",
+  },
+  avatarUrl: {
+    type: String,
+    default: "",
+  },
+  isPublic: {
+    type: Boolean,
+    default: true,
+  },
+  followers: [{
+    type: mongoose.Schema.Types.ObjectId,
+    ref: "User",
+  }],
+  following: [{
+    type: mongoose.Schema.Types.ObjectId,
+    ref: "User",
+  }],
+  accessToken: {
+    type: String,
+    default: () => crypto.randomBytes(128).toString("hex"),
+  },
+});
+
+export const User = mongoose.model("User", userSchema);

backend/package.json

@@ -3,18 +3,34 @@
   "version": "1.0.0",
   "description": "Server part of final project",
   "scripts": {
-    "start": "babel-node server.js",
-    "dev": "nodemon server.js --exec babel-node"
+    "start": "node dist/server.js",
+    "dev": "nodemon --watch . --exec ts-node server.ts",
+    "build": "tsc"
   },
   "author": "",
   "license": "ISC",
   "dependencies": {
     "@babel/core": "^7.17.9",
     "@babel/node": "^7.16.8",
     "@babel/preset-env": "^7.16.11",
+    "bcrypt": "^6.0.0",
+    "cloudinary": "^2.9.0",
     "cors": "^2.8.5",
+    "dotenv": "^17.2.4",
     "express": "^4.17.3",
-    "mongoose": "^8.4.0",
+    "express-list-endpoints": "^7.1.1",
+    "mongodb": "^7.1.0",
+    "mongoose": "^8.23.0",
+    "multer": "^2.1.0",
     "nodemon": "^3.0.1"
+  },
+  "devDependencies": {
+    "@types/bcrypt": "^6.0.0",
+    "@types/cors": "^2.8.19",
+    "@types/express": "^5.0.6",
+    "@types/multer": "^2.0.0",
+    "@types/node": "^25.2.3",
+    "ts-node": "^10.9.2",
+    "typescript": "^5.9.3"
   }
-}
+}