Link to website http://it2810-14.idi.ntnu.no/project2
Curate is a website where users can browse, buy and sell physical forms of music, such as vinyl, casettes and CD's, as well as music oriented equipment, such as headphones, turntables, etc. The user navigates through products on the explore page, lists an item on the sell page and chats to buyers or sellers on the chat page. A user can find out more about the products by clicking on it, where you are also able to favorite the desired product by clicking the heart in the top corner of the product image. Favorites and listings are found in your profile page. A user who has listed a product can also set that product as "SOLD", or delete the product altogether.
If you want to jump straight in and look at all the current functionality, the user stingrayjohn has a few chats, listings and favorite products. Just type "stingrayjohn" as the username on the login page to log in as him.
The frontend is currently sending queries to "http://it2810-14.idi.ntnu.no:3001/graphql", if you want to download the project and run the backend locally, change this in the apolloClient.ts file to "http://localhost:3001/graphql". For examiners: the backend is located in /home/jensku/project2/backend on the VM.
T14-PROJECT-2
├── backend
│ └── src
│ └── schema
├── docs
├── frontend
│ ├── cypress
│ │ ├── e2e
│ │ ├── fixtures
│ │ └── support
│ ├── public
│ │ ├── fonts
│ │ ├── homeImages
│ │ └── icons
│ └── src
│ ├── components
│ ├── config
│ ├── hooks
│ ├── mocks
│ ├── pages
│ ├── state
│ ├── test
│ └── utils
└── README.md
Above is a simple overview of the project structure. You can find more detailed structures in the backend-readme and the frontend-readme.
In the root of the project there are two directories:
The backend directory is where the server and graphql schemas are kept.
In src you will find the react files for the project. Here is a description of the main folders:
- Pages: Directory containing the project pages.
- Components: Directory containing the components seen on the pages.
- Hooks: Directory containing custom hooks.
- Utils: Directory containing various and useful utilities
2.1. Follow the instructions on the neo4j installation page https://neo4j.com/docs/desktop-manual/current/installation/download-installation/ and install Neo4j Desktop 1.6.1.
2.2. After installation is complete, open the program and go to the "Projects" tab. Press the "New" button, choose a name and password for your database, and choose version 5.24.0. Press "Create" and wait for the DBMS to load.
2.3. When the project has been initialized, click on the database name to open a new tab to the right. In that tab press plugins and install the APOC plugin. When APOC is installed, press the start button to run the database. After that, press the blue "Open" button to open Neo4j Browser.
2.4. In Neo4j Browser, click the input field at the top of the window (the bar with "neo4j$") and write the command below to create a unique username constraint in the database:
CREATE CONSTRAINT unique_username FOR (u:User) REQUIRE u.username IS UNIQUE
2.5. Next, write the new command below to create a full-text search index that is used to search for products in the database:
CREATE FULLTEXT INDEX productSearch FOR (n:CProduct) ON EACH [n.title, n.description, n.artist, n.brand, n.model, n.format, n.category, n.genres, n.location]
3.1. Run cd backend
3.2. Create a .env file in the root of the backend folder containing your database name and password like this (the database name is by default neo4j if you have not changed it):
NEO4J_URI=bolt://localhost:7687
NEO4J_USER=neo4j
NEO4J_PASSWORD=password
3.3. Run npm install
3.4. Run npm start
Note: Running locally will not allow you to upload images to the site, as we use Amazon Web Services S3 for storing images and chose not to display sensitive account information here. Examiners will still have access to the credentials, as they lie in a .env file on the virtual machine.
4.1. Run cd frontend
4.2. Run npm install
4.3. Run npm run dev
For information on our desicions regarding testing, sustainability, accessibility, technology, and functionality, check out: