diff --git a/README.md b/README.md index e4c3ecd233695a62e16113714594bc68b8937d2d..7f2856afc3a6bc4784208b964931a6176bd383cc 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,152 @@ # 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" + + + +# Architecture + +Architecture can also be found in the project's root folder in a folder called "Architecture_diagrams" + +Component abstraction + + + +Container abstraction + + + +Context abstraction + + +