Apgiiit.com

This is a web application which displays latest Covid 19 related data from official sources. The API used in building this website is https://covid19api.com/. The API only has a single end-point which has data for all the countries.

Material UI is used for UI components in this application like the drop-down menu, card and others. There aren't many to be honest as this app only has a single page. Still, react-router-dom is used to render this single page which displays Global data as well as country specific data when a given country is selected.

If you enjoyed this project, please leave a star on Github and show some support.

Technologies

Homepage-1

Homepage-2

Countries list

This is the second chat based application I worked on within last week. This one is slightly different from the last one I had in MEVN stack. This one for starters is anonymous, meaning it does not have authentication and database connection. It would stay anonymous but, I might add database connectivity in future. This uses Jquery plugged into multi-page Express application, no modern frontend framework.

For styling it uses Tachyons CSS library/framework - https://github.com/tachyons-css/tachyons. It was overall a pleasant experience working with it. I had used this in one of my projects a couple of years back. It is very similar to Bootstrap and uses Mobile first architecture.

The application itself is very simple, you are asked to enter your username so that others in the room can identify you. If someone else is already using that username you get an error, otherwise a chat window is displayed where you can see the list of messages and the current users online at that particular moment of time. Each window would open a new socket, communication is done through emitting events and listening to it on frontend and back-end.

If you enjoyed this project, please leave a star on Github and show some support. Always tend to end my posts with this line, but it really something that keeps me motivated to continue adding this minor projects on my profile and spread learning.

Technologies

Homepage

Chatroom

This app has a bit of history behind it. It was I think 3 years back when I first had an exposure to Material UI. I created this hobby app which used API from this website called potterapi or something, I can't remember exactly. It had information about characters, spells and houses. It was made originally in Vue. But, then the API was shut down so wasn't possible to get the data so had to bring down this repo.

Fast forward 3 years now, I stumbled upon this API hosted on Heroku https://wizard-world-api.herokuapp.com. It worked and wasn't equipped with any sort of authentication. I was also curious to use newly learned redux toolkit and blueprint JS. It was a perfect source to be used to populate the app with some data and that is how it came into existence.

This API has data for wizards, though character data is not complete. But there is almost complete data available for potions, spells and houses which was suffice to motivate me to use this app. Though at the time of writing this I probably have a better API for Harry Potter data here - https://hp-api.herokuapp.com/. It did work at the time of writing this post, don't know how long would it work. Anyway, the app uses Redux toolkit based approach for data management which eliminates the need for creating separate constants and reducers following conventional redux based approach in React. Here you can club constants and reducers in a single file which you would often call 'Slice'. You would have as a service which would make API calls. Finally, you combine all the reducers into the main app.

For UI, it uses Blueprint JS. It has almost 10K stars on Github and in general, a nice UI kit to work with. I did face issues with some dynamic components like Modal/Dialogue for instance. Documentation is not all that great unfortunately in my opinion, but still a good UI kit to work with.

Technologies

Elixir

Spells

Houses