I did a fullstack approach, frontend (React + acios), backend (java + spring framework) and a cloud based storage in MongoDB.
Started by brainstorming and doing some scetches. After some time I decided that a visual architecture would help. By using Lucidcharts I managed to draw an arcitecture.
After doing this I decided that the most important aspect of the solution would be to get the frontend up and running becase Stacc alredy had a working API up and running at "https://code-challenge.stacc.dev/api/".
When designing this I decided that a SPA was the smartest option as this will work as an search engine within the PEP database.
I decided to use FIGMA as the design tool of my choice. By making components, deciding colors and fonts, the implementation would be easier.
- Clean and simple
- Intuitive
- Inspired colors and font from Stacc webpages
- Again clean and simple
- Accordions to show result
- Should expand on click
- Duisplay all information about the search object
- Navigate to
/Stacc-KYC-Assignment/frontend - Install dependencies:
npm install - Start the application:
npm run dev
- Build Project
- Navigate to
/Stacc-KYC-Assignment/backend - Install dependencies:
mvn clean install - Run project:
mvn spring-boot:run
- Install pymongo:
python3 -m pip install pymongo Add your IP-address to known ip addresses on: https://cloud.mongodb.com/- Automaticly connect to db through backend
Even though I could easily have added NavBar and Footer etc. I did not see that necessary since it would all just be superficial with no real functionality. My solution is clean and simple
As Stacc alredy provided me with a working API, I decided to focus on my weakness, i.e. Frontend. This is because for me setting up the API is not as challenging as creating a working frontend application.
I really like the aspect of a Single File Component and styled component does exactly that. Here one can style the comonents within the same file in a CLEAN manner.
The reason I went with MongoDB as the DB was just because I wanted something remote and in the cloud when working with the project. Used python to initialize the db and populate it with the data from pep.csv to show that I can handle python as well.
The reason I went with java + Spring Framework was just to show that I can handle java. It would probably be easier to just set it up using Flask, however I used python to populate the data, so java remains.