Skip to content

Vivek-736/Tech-Trek

Repository files navigation

TechTrek

Welcome to TechTrek — a modern developer events platform built with the latest Next.js (v16), MongoDB, and Mongoose. TechTrek helps developers discover and register for technical events, workshops, and meetups with a delightful, fast, and accessible UI.

TechTrek is designed for maintainability, developer DX, and fast production delivery. This README shows how to run, develop, and deploy the app, plus notes on the data model, API endpoints, environment variables, and contribution guidelines.


Highlights

  • Built with Next.js 16 (app router, server components, streaming where appropriate)
  • MongoDB for durable event and registration storage
  • Mongoose as the ORM layer with typed schemas and validation
  • Authentication-ready (extensible to providers: NextAuth, Clerk, Auth0)
  • Event registration flow: browse events, view event details, register, manage registrations
  • SSR + incremental static features for performance and SEO
  • Minimal, testable API routes with clear contracts

Quick demo

Below are the typical flows you can expect in TechTrek:

  • Explore upcoming developer events
  • View event details (speakers, agenda, location, capacity)
  • Register as an attendee and receive a confirmation
  • Admin interface (future) for creating and managing events

Table of contents


Tech stack

  • Next.js 16 (app router, latest React features)
  • React 18+ (concurrent features where appropriate)
  • MongoDB (Atlas or self-hosted)
  • Mongoose ORM for models, validation and hooks
  • Tailwind CSS / plain CSS (project may include globals.css)
  • Optional: TypeScript (project scaffolding includes tsconfig.json)

Requirements

  • Node.js 18+ (recommended LTS) or newer
  • npm, pnpm, or yarn
  • MongoDB connection (local or Atlas)

Getting started (local)

  1. Clone the repo:
git clone https://github.com/<your-org>/tech-trek.git
cd tech-trek
  1. Install dependencies (choose one):
# npm
npm install

# or pnpm
pnpm install

# or yarn
yarn install
  1. Create a .env.local (see Environment variables below).

  2. Run the development server:

# npm
npm run dev

# or pnpm
pnpm dev

# or yarn
yarn dev
  1. Open http://localhost:3000 in your browser and start exploring.

Environment variables

Create .env.local in the project root and add the following (replace placeholders):

MONGODB_URI=mongodb+srv://<username>:<password>@cluster0.mongodb.net/techtrek?retryWrites=true&w=majority
NEXT_PUBLIC_APP_NAME=TechTrek
NEXT_PUBLIC_BASE_URL=http://localhost:3000
# Optional auth and email config
SMTP_HOST=smtp.example.com
SMTP_USER=...
SMTP_PASS=...
# Optional: analytics provider
POSTHOG_API_KEY=pk_...

Notes:

  • MONGODB_URI is required for development and production.
  • NEXT_PUBLIC_... variables are exposed to the browser; keep only non-sensitive values there.

Run scripts

Common scripts found in package.json:

  • dev — start Next.js dev server
  • build — production build
  • start — start built app
  • lint — run ESLint
  • test — run tests (if present)

Example:

npm run build
npm start

Database & models (Mongoose)

TechTrek stores events and registrations in MongoDB. A simple model sketch:

  • Event

    • title: String
    • slug: String (unique)
    • description: String
    • startDate: Date
    • endDate: Date
    • capacity: Number
    • location: String (or online link)
    • speakers: [{ name, bio, avatar }]
  • Registration

    • eventId: ObjectId -> Event
    • attendeeName: String
    • attendeeEmail: String
    • createdAt: Date

Example Mongoose usage (high-level):

import mongoose from 'mongoose'

const EventSchema = new mongoose.Schema({
	title: { type: String, required: true },
	slug: { type: String, required: true, unique: true },
	description: String,
	startDate: Date,
	endDate: Date,
	capacity: Number,
	speakers: [{ name: String, bio: String }],
})

export const Event = mongoose.models.Event || mongoose.model('Event', EventSchema)

Make sure your app reuses a single global Mongoose connection in server environments to avoid connection storms during hot reloads. A common helper is lib/mongoose.ts.


API surface

TechTrek exposes small API routes under app/api or pages/api depending on setup. Example endpoints:

  • GET /api/events — list events (filters, pagination)
  • GET /api/events/[slug] — event details
  • POST /api/events/[slug]/register — create a registration for an event

Example registration contract (request -> response):

POST /api/events/my-event/register

Request JSON:

{ "name": "Alex Dev", "email": "alex@example.com" }

Response (201):

{ "ok": true, "registrationId": "...", "message": "Registered successfully" }

Handle edge cases: capacity reached, duplicate email, invalid payloads.


Deployment

Recommended: Vercel (first-class Next.js support) or any Node server + MongoDB (Atlas).

Vercel steps:

  1. Push your repository to GitHub.
  2. Import project into Vercel and set environment variables (same names as .env.local).
  3. Deploy — Vercel automatically handles builds.

If self-hosting:

  • Build: npm run build
  • Start: npm start (ensure NODE_ENV=production and MONGODB_URI available)

Testing

Add unit tests for model logic and API route integration tests for registration flows. A minimal test plan:

  • Unit: validate Event model capacity logic
  • Integration: register endpoint returns 201 and creates a document

You can use Jest + Testing Library for React + supertest for API tests.


Security & production notes

  • Validate and sanitize incoming data (use Zod or Joi for runtime validation).
  • Rate-limit registration endpoint to prevent spam.
  • Use HTTPS in production and secure cookies if using sessions.
  • Store secrets in environment variables (never commit secrets).

Contributing

We welcome contributions!

  1. Fork the repo
  2. Create a branch: git checkout -b feat/your-feature
  3. Make changes and add tests
  4. Open a PR describing the change

Please follow the code style and run npm run lint before opening a PR.

If you want help with a contribution idea, open an issue and we'll discuss the scope.


Useful commands (summary)

# Run dev server
npm run dev

# Build for production
npm run build

# Start production
npm start

# Run lint
npm run lint

# Run tests (if present)
npm test

Roadmap / ideas

  • Admin dashboard for event creation and attendee exports
  • Email confirmations and calendar invites
  • Ticketing (paid events)
  • Social login and team registrations

Credits

Built with ❤️ using Next.js, MongoDB, and Mongoose.


If you want, I can:

  • Add this README.md into your repo now (I can commit it),
  • Generate a sample .env.example and a simple lib/mongoose.ts connection helper,
  • Or tailor the tone (more formal, shorter, with images/screenshots placeholders).

Tell me which of the above you'd like next and I will proceed.

About

A web application that enlists all the developer events, the cardinal focus is on the latest features of nextjs-16 which has got a new feature for caching the dynamic data which gets partially pre-rendered (PPR)

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors