Display posts as a tree view with post editing functionality
Technologies used: HTML, CSS, SCSS, Javascript, React, Typescript
Posts are fetched from the backend server on page load. If for some reason the request fails (like when the backend is not running) then the posts are loaded from a JSON file from inside the src
folder. The posts are shown in a tree view sorted by week by default. Posts can be sorted either by week, location or author.
Clicking a post element reveals additional post related information such as author, location, date and edit button.
You can edit a post's author and location by clicking on the edit icon (a small pencil icon next to the post date). The modal window which appears on clicking the edit icon contains the form to edit author and location of that particular post.
ℹ️ Make sure to have Node and npm installed on your system before you begin installation.
- Navigate to the frontend folder through command line.
- Run
npm install
to install all the dependencies.
Use npm start
to run the frontend locally in a dev environment.
Use npm test
to run tests
Backend is a simple express server. Posts are served with a simple api url.
API URL: http://localhost:3100/get-posts
- Navigate to the backend folder through command line.
- Run
npm install
to install all the dependencies.
Run node index.js
command in the command line to run the backend locally.
Created by Gautam Thapar