Playing with the Typicode API using ReactJS as the Front-end library
- git clone the repo on your local machine
git clone "https://github.com/firebase007/typicodeFAKEAPI-React" - cd in the directory
cd [directory-name] - run
npm installfrom your terminal/command prompt - run
npm start - Navigate to the url on the browser using this link,
(https://www.localhost:3000)
- Refactor all components - done
- Look out for perfomance bottlenecks
- Check for scalability concerns
- Overhaul the entire UI as the current one is just for testing out purposes
- Use styled components for the component styling
- Use react boostrap for the cards and for displaying the list items
- Host on Heroku
Check out the typicode API here- http://wwww.jsonplaceholder.typicode.com
To see a list of usernames to login with, check out this API URI, http://jsonplaceholder.typicode.com/users
Alternatively,
These are the usernames Available from the API for login
- Bret
- Antonette
- Samantha
- Karianne
- Kamren
- Leopoldo_Corkery
- Elwyn.Skiles
- Maxime_Nienow
- Delphine
- Moriah.Stanton
Other url resources can be found on this link here,http://wwww.jsonplaceholder.typicode.com as the case maybe.
There is this large company with a website where posts of all company employees can be displayed and the public/customers can leave comments on the posts. The company wants more employees to publish post here, therefore they need you to build an application specific for the employees of the company, that helps them to easily publish posts to the system and review their customer comments. (Directly copied from the trial task given to me by Dreamlines)
As an employee, I want to be able to login very easily only with my username to get access to my private space. (no password needed). Typing in my username each time could get in my way to be able to create posts fast on the fly, so it would be great if the application remembers my username and logs me in my account automatically if I revisit the application with the same browser/computer again. To be safe to use the application on my colleges computer as well I need a logout mechanism to prevent other people of using my account to login. After login, I want to see my personal user profile data, like name, email-address etc. somewhere on the screen,to be sure I am accessing my private space of the app and I can identify with it. In my space I want to be able to see all my Posts from the past in a Listview with the total count of my posts so I have a feeling I am making progress. At each post item in my list I need to see the number of comments related to it. This is very important to me to have a better understanding about what kind of topics people are interested in. With a “show comments” button I want to be able to read all related comments to a post within the list. A comment item should show me the body text, name and email of the commenting user so I can get in touch with them with one click and give them feedback on their comment. (Directly copied from the trial task given to me by Dreamlines)
Contributions to this project are highly welcome. However, please ensure to follow the guidelines and roadmap. I would like a situation where we could write a tutorial about this and open source everything just for those starting out with building with React JS and playing around with APIs/network events and other stuff alike.
Special thanks to Dreamlines for giving me this opportunity and for the open source API by Typicode