Skip to content
Snippets Groups Projects
user avatar
authored

Tickcrypt

Web app marketplace to create and sell event tickets as NFTs using MERN.

How to run the application

  1. Git clone the project

  2. Open the project in visual studio code

  3. Run "npm install" in the frontend folder

  4. Run "npm install" in the project root directory (Tickcrypt)

  5. Run "npm install" in the backend folder

  6. Run "npm start" in frontend folder

  7. Run "npm start" in backend folder

  8. Install and open MongoDB compass

  9. On MongoDB compass, connect to the localhost db

  10. Navigate to the events collection in the Tickcrypt db

  11. At the top of MongoDB compass toolbar, click collection tab, import data

  12. Select the CSV option and select the file called "events.csv" found in the project's root folder

  13. Press import

  14. Navigate in the browser to: localhost://3000/Marketplace

Assumptions

Internet access would be available 24/7 working remotely Using JS across the stack would speed up development All tools were free to use The frontend dev work would take less time Each segment of development would take the same proportionate amount of time All tools, libraries, frameworks would be obtainable and accessible No dev hardware would become faulty

Links to documentation

MongoDB https://docs.mongodb.com/ Used to store user, event, purchase, and card detail data

Express https://expressjs.com/ Used to build the API interfaces

React https://reactjs.org/docs/getting-started.html Used to build the front end components

Node https://nodejs.org/en/docs/ Used to deploy server nodes for frontend and backend proxy

npm https://docs.npmjs.com/ Used to manage packages and installation

MongoDB compass https://www.mongodb.com/products/compass Used as a GUI for using MongoDB

babel https://babeljs.io/docs/en/ Compiler used to convert modern JS to run on older browsers

Mongoose https://mongoosejs.com/docs/api.html Used to abstract complexity of pure Mongo and to make life easier with object data

Tailwindcss https://tailwindcss.com/docs/installation Used to style the frontend

Material UI https://mui.com/ Used to source out-the-box styled components for the frontend

Axios https://axios-http.com/docs/intro Used to make the HTTP request calls from node to the APIs

Craco https://www.npmjs.com/package/@craco/craco Used to override app configuration - babel, postcss, tailwindcss

React-router-dom https://www.npmjs.com/package/react-router-dom Used to enable dynamic routing using react components

Express-Validator https://express-validator.github.io/docs/ Used to validate form inputs on the backend

Morgan https://www.npmjs.com/package/morgan Used to log HTTP requests and errors, simplifying the process

Bcrypt https://openbase.com/js/bcrypt/documentation Used to hash passwords and secure credentials

CORS https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS Used to relax the security held on the API due to cross origin policy

Nodemon https://www.npmjs.com/package/nodemon Used to restart the server upon code changes (dev efficiency)

Body-parser https://www.npmjs.com/package/body-parser Used to process the data of sent HTTP request bodies

JWT https://www.npmjs.com/package/jsonwebtoken Used to authenticate users

js-cookie https://www.npmjs.com/package/js-cookie Used to establish cookie (set, get, remove )

navigate https://www.npmjs.com/package/navigate Used to navigate and redirect users based on requests

cookie-parser https://www.npmjs.com/package/cookie-parser Used to parse cookie data by attaching it to the client request object

Multer https://www.npmjs.com/package/multer Middleware used to handle image uploads

Requirements

Functional and non-functional requirements can also be found in the project's root folder called "requirements.png"

Requirements

Architecture

Architecture can also be found in the project's root folder in a folder called "Architecture_diagrams"

Component abstraction

component

Container abstraction

container

Context abstraction

context