Skip to content

Fullstack Event ListApp is an application thanks to which you can check registered events and add new events to registered events base by yourself. The application consists of two sides: backend and frontend one. Registered events are saved to database.

Notifications You must be signed in to change notification settings

PiotrRynio/fullstack-event-list-app

Repository files navigation

Fullstack Event ListApp


Overview

Fullstack Event ListApp is an application thanks to which you can check registered events and add new events to registered events base by yourself. The application consists of two sides: backend and frontend one. Registered events are saved to database. Using the app you are going to get to know with events data and information about authors (first name, last name and email address). You can also register new events by yourself using registration form.

Backend side is created with Hexagonal Architecture and Modular Monolith Architecture (currently single module - ready to expand by further modules). The app is covered with tests both on backend and frontend. Data validation takes place both on browser and server side. Error handling is implemented too. The application is coded with use of TypeScript, React, Node, Express, MongoDB, Mongoose, Jest - with use of good practice of clean code. Code formatted with use of Prettier.

Have fun with Event List!

The following technologies/libraries/methodologies were used:

Frontend:

  • React
  • react-route
  • react-query
  • react hooks
  • TypeScript
  • Regex
  • Styled Components
  • react testing library
  • Jest
  • dom testing library
  • MSW - Mock Service Worker (backend API queries mocking)
  • RWD

Backend:

  • TypeScript
  • Node
  • Express
  • MongoDB
  • Mongoose
  • Jest
  • Supertest
  • Nodemon
  • Hexagonal Architecture
  • Modular Monolith Architecture (currently single module - ready to expand by further modules)
  • Docker Compose
  • rest API

Other:

  • Prettier
  • Husky (pre-commit)
  • lint-staged
  • Full Responsive
  • Clean Code
  • Git & GitHub
  • IntelliJ
  • Postman

Running the project

Running this project locally:

  1. Install Docker & Docker Compose.
  2. Clone this project locally.
  3. Run docker-compose -f docker-compose.yml up in your bash/command line (in main folder). Make sure that ports 3000 and 5000 snd 27017 are free on your machine before.
  4. Go to http://localhost:3000 in your browser.

Running tests:

  1. Run npm install in your bash/command line (in main folder).

  2. Run npm run test-fe in your bash/command line.

  3. Run npm run test-be in your bash/command line.

    In case of failed MongoDB tests you should run Docker (look above)
    or install proper version of MongoDB Compass.

Others:

  1. API port: 5000.
  2. MongoDB port: 27017.
  3. Node version: 16.
  4. NPM version: 8.1.2
  5. You can start without Docker too
    (You may need another steps than below ex. installing proper version of MongoDB Compass):
    1. Run npm install in your bash/command line (in main folder).
    2. Next npm run start-fe (frontend) or npm run start-be (backend) in your bash/command line (in main folder).

Authors

Piotr Rynio
Contact: [email protected]
github.com/PiotrRynio/


Images:

About

Fullstack Event ListApp is an application thanks to which you can check registered events and add new events to registered events base by yourself. The application consists of two sides: backend and frontend one. Registered events are saved to database.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages