Hi! Are you an avid programmer looking for a way to code for the greater good? Are you a curious
philanthropist eager to help out a community?
Well look no further! Welcome to Kurius' beta launch of our open-source platform HackItForward!
HackItForward Beta Launch
& A Thank You Gift
As this is only the beta version of our platform, we are expecting there to be some bugs that we
unfortunately could not catch during production. If you happen to notice anything wrong, please let
us know in our discord server, or
submit an issue notice on our github repo.
For being among our very first users, you will recieve a very special badge as a token of thanks when
you sign up! We hope you enjoy using HackItForward!
The project's workspace is bootstraped using Create-React-App. Everything is built using React components. React states are used to keep track of tasks. This complies with React standards, which states only changes in states and props should re-render webpage.
An app that allows you to add todos and complete them!
Specific features with React.js:
getCategories() to retrieve every file!
AddCategory, Categories, Category, AddTodo, Todos, Todo components with props!
How It's Built
This project was built in two different parts: the frontend and the backend. The frontend was built with React.js. The backend was built using Express.js and MySQL! I built an API (not complete yet) to query data from the MySQL database!
What I learned
Maybe I should have stuck to React functions instead of classes :(
I learned about React hooks such as componentDidUpdate() and componentDidMount() and the best way to implement a reactive app that updates the state without reloading while storing the data (two saving systems: save it in react states and save it in the api; when user reloads page, api fetches stored data in database)! Also, I learned how to pass methods as props to other child components!
Implementing the following features:
React updates by its state while sending requests to the api to store the data in the database.
My project has basic CRUD functionality. It's actually connected to a backend server made using node and express.
Delete Todos(Mark them as done)
How It's Built
React is a client that runs separate from the server. It makes requests to the node server via the Fetch API built into JS.
On the back-end, I planned to use MySQL. However, this is the first time I've used React, so it took me very long, and many mental breakdowns to get the app working. It is currently 1 hour to the deadline. Anyhoo, The app I've submitted does not use MySQL on the backend.
My app does not yet have user authentication, either. I planned to use Qoom, but did not have time for that either.
I plan to implement MySQL on the backend. I've used PostgreSQL before, so MySQL shouldn't be much different (they use the same syntax). I also wanted to do user authentication with Qoom, but it seems tough, as Qoom has its own database it must be used with. I might just end up using plain old PassportJS for user authentication, since it's light and versatile. (Not dependent on DBs.)