How yashz0r0/online_job_portal works
1. High-level shape
- This repository is a classic two-tier job portal: a static frontend in frontend/ and a Node.js/Express backend in backend/.
- The backend exposes a REST API; the frontend is served separately and consumes that API via fetch.
2. Frontend boundary
- The frontend is composed of plain HTML, CSS, and vanilla JavaScript, not a SPA framework.
- Pages are split by function: landing (index.html), auth (login.html, register.html), jobs browsing (jobs.html), and user dashboard (dashboard.html).
- JavaScript files in frontend/js/ handle page behavior, auth state, API calls, and rendering dynamic data.
3. Client-side data flow
- auth.js appears to manage registration/login state and token handling.
- config.js centralizes API base configuration.
- jobs.js, dashboard.js, and main.js likely orchestrate page-specific requests to the backend and update the DOM.
- Authentication tokens are stored client-side, with browser-side logic gating access to dashboard-style pages.
4. Backend application layer
- The backend is organized in the standard Express pattern:
- routes/ defines URL endpoints.
- controllers/ contains request handlers and business logic.
- models/ encapsulates database access.
- middleware/ contains auth/authorization checks.
- server.js is the composition root: it starts the HTTP server and wires middleware, routes, and CORS/JSON parsing.
5. Database boundary
- The backend connects to MySQL through backend/config/db.js, using credentials from backend/.env.
- Persistence is relational and normalized around core entities: users, companies, job seekers, employers, job categories, jobs, and applications.
- The repository’s README includes the schema, which is useful for understanding the object relationships and foreign keys.
6. Core domain model
- Users is the central identity table, with a role that splits behavior into JobSeeker and Employer.
- JobSeeker and Employer are profile extensions of the base user record.
- Company is linked to employers, while Jobs are posted by employers and classified by category.
- Applications connect job seekers to jobs and store application status plus cover letter/resume metadata.
7. Authentication and authorization
- Authentication is JWT-based, with passwords hashed using bcrypt.
- authMiddleware.js enforces protected routes and likely checks role-specific access, especially for employer-only actions like posting jobs or updating applications.
- The architecture is therefore role-aware, not just login-protected.
8. Main backend route groups
- userRoutes.js handles registration and login.
- jobRoutes.js serves job discovery and job creation.
- jobSeekerRoutes.js and employerRoutes.js manage role-specific profiles.
- applicationRoutes.js handles applying, listing applications, listing applicants, and status updates.
- categoryRoutes.js exposes job categories used for filtering and posting.
9. Write paths vs read paths
- Read-heavy flows include browsing open jobs, viewing categories, loading profiles, and fetching applications.
- Write-heavy flows include account creation, profile upserts, job posting, applying to jobs, and employer status updates.
- The unique application constraint in the schema indicates the system prevents duplicate applications for the same job/user pair.
10. Important external/runtime dependencies
- Backend runtime: Node.js with Express.
- Database: MySQL with mysql2.
- Security: jsonwebtoken for sessions/tokens and bcryptjs for password hashing.
- Frontend runtime: browser-only, with no bundler or frontend framework required.
11. Operational layout
- Backend runs on port 5000; frontend is typically opened directly or served on 8080.
- Because the frontend is static and separate, deployment can be split: API service plus static file hosting.
- CORS is enabled in the backend so the browser client can call the API across origins.
12. Architecture diagram emphasis
- The key diagram should show:
- Browser UI pages and JS modules
- REST API boundary in Express
- Controller/model separation inside backend
- Auth middleware on protected routes
- MySQL database with the user/job/application schema
- The most important flows are: register/login → JWT/token use → protected profile/job/application actions → MySQL persistence.
Main entry points: server.js Express server · db.js DB config · index.html Browser · authMiddleware.js Auth middleware
Components 29
Frontend
Static browser UI and client-side page logic.
- Browser · Opens the static site, stores auth state, and calls the API.
frontend/index.html - Landing · Public entry page for the portal.
frontend/index.html - Auth pages · Login and registration screens.
frontend/login.html - Jobs page · Browse and filter job listings.
frontend/jobs.html - Dashboard · Authenticated user dashboard for profile and application activity.
frontend/dashboard.html - Client auth · Handles login state, token storage, and protected-page gating.
frontend/js/auth.js - API config · Central API base configuration for browser requests.
frontend/js/config.js - Main UI · Landing-page behavior and shared frontend interactions.
frontend/js/main.js - Jobs UI · Fetches and renders job browsing data.
frontend/js/jobs.js - Dashboard UI · Loads authenticated user data and updates dashboard views.
frontend/js/dashboard.js
Backend
Express API, middleware, controllers, and data models.
- Express server · Composition root that starts the HTTP API and wires middleware and routes.
backend/server.js - Auth middleware · Protects authenticated and role-aware backend routes.
backend/middleware/authMiddleware.js - User routes · Registration and login endpoints.
backend/routes/userRoutes.js - Job routes · Job discovery and job creation endpoints.
backend/routes/jobRoutes.js - App routes · Job application submission, listing, and status updates.
backend/routes/applicationRoutes.js - Profile routes · Role-specific job seeker and employer profile endpoints.
backend/routes/jobSeekerRoutes.js - Category routes · Job category endpoints for filtering and posting.
backend/routes/categoryRoutes.js - User controller · Handles auth-related request logic.
backend/controllers/userController.js - Job controller · Coordinates job listing and posting logic.
backend/controllers/jobController.js - Application controller · Processes applications, applicant lists, and status changes.
backend/controllers/applicationController.js - Profile controller · Manages job seeker and employer profile operations.
backend/controllers/jobSeekerController.js - Category controller · Serves job category data.
backend/controllers/categoryController.js - DB config · MySQL connection setup and credentials loading.
backend/config/db.js - Users · Identity and role records.
backend/models/userModel.js - Profiles · Job seeker, employer, and company domain data.
backend/models/jobSeekerModel.js - Jobs · Job posting and employer linkage data.
backend/models/jobModel.js - Applications · Applications and their status metadata.
backend/models/applicationModel.js - Categories · Job category lookup data.
backend/models/categoryModel.js
Database
MySQL persistence and relational domain data.
- MySQL · Relational persistence for users, profiles, jobs, categories, and applications.
Connections 42
- Browser → Landing: opens · The browser loads the public entry page.
- Browser → Auth pages: navigates · Users move between login and registration screens.
- Browser → Jobs page: opens · Browsers view job listings.
- Browser → Dashboard: opens · Authenticated users access the dashboard.
- Landing → Main UI: uses · Landing page behavior is driven by shared JS.
- Auth pages → Client auth: uses · Login and registration logic updates auth state.
- Jobs page → Jobs UI: uses · Jobs page logic fetches and renders listings.
- Dashboard → Dashboard UI: uses · Dashboard page logic loads protected data.
- Client auth → API config: reads · Auth flows use the shared API base configuration.
- Jobs UI → API config: reads · Jobs UI uses the shared API base configuration.
- Dashboard UI → API config: reads · Dashboard UI uses the shared API base configuration.
- Browser → Express server: fetches REST · The static client calls the backend API across origins.
- Express server → User routes: mounts · Express mounts auth-related endpoints.
- Express server → Job routes: mounts · Express mounts job endpoints.
- Express server → App routes: mounts · Express mounts application endpoints.
- Express server → Profile routes: mounts · Express mounts role/profile endpoints.
- Express server → Category routes: mounts · Express mounts category endpoints.
- User routes → User controller: delegates to · Route handlers forward to auth controllers.
- Job routes → Job controller: delegates to · Route handlers forward to job controllers.
- App routes → Application controller: delegates to · Route handlers forward to application controllers.
- Profile routes → Profile controller: delegates to · Route handlers forward to profile controllers.
- Category routes → Category controller: delegates to · Route handlers forward to category controllers.
- Job routes → Auth middleware: protects · Job creation and other protected actions pass through auth checks.
- App routes → Auth middleware: protects · Application and employer actions require authorization.
- Profile routes → Auth middleware: protects · Profile routes are guarded by role-aware auth.
- User controller → DB config: queries · Controllers use the database connection layer.
- Job controller → DB config: queries · Job logic persists and reads via the DB connection.
- Application controller → DB config: queries · Application logic persists and reads via the DB connection.
- Profile controller → DB config: queries · Profile logic persists and reads via the DB connection.
- Category controller → DB config: queries · Category data is loaded through the DB connection.
- DB config → MySQL: connects to · MySQL is the persistence backend.
- Users → MySQL: stores · Users are stored in MySQL tables.
- Profiles → MySQL: stores · Profiles and company data are stored in MySQL tables.
- Jobs → MySQL: stores · Job records are stored in MySQL tables.
- Applications → MySQL: stores · Application records are stored in MySQL tables.
- Categories → MySQL: stores · Category records are stored in MySQL tables.
- User controller → Users: uses · Auth logic reads and writes user records.
- Job controller → Jobs: uses · Job logic reads and writes job records.
- Application controller → Applications: uses · Application logic reads and writes application records.
- Profile controller → Profiles: uses · Profile logic reads and writes profile records.
- Category controller → Categories: uses · Category logic reads and writes category records.
- Auth middleware → Users: verifies · Middleware checks user identity and roles against persisted data.