React JS Projects
As part of the She Codes Plus program we learned to code with React JS. Below are some of the projects I created during the module.
Equipme Crowdfunding App - Front End
My final project submission for the React JS module of She Codes Plus program was to create a client side app using React JS, HTML, CSS and JavaScript that sends GET and POST API calls to my Django REST Framework back end server.
The app is a crowdfunding platform for people who want to raise money to purchase sporting equipment. Users can create a request, view all requests, view a single request, update their own request and donate to a request. It has user authentication, so users can sign up, log in and log out.
Click on the image to view the deployed site or the GitHub repo, where you can read more about the project objectives.
Group Project - Diveristech - Front End
Our final project for the She Codes Plus program was to work in a team of 6 to create a web platform for a client that helped to connect people in tech who are typically underrepresented and usually find it difficult to find other 'people like them' to connect with. The client side app used React JS, HTML, CSS and JavaScript that sends GET and POST API calls to our Django REST Framework back end server.
Users can create an account, create a profile, filter profiles by multiple selections, view a single profile and if they are logged in, they can obtain contact details to connect to the profile owner.
My main contrubution to the client side app was the filtering functionality. I also created the bones of the user sign-up, login and create profile forms
Click on the image to view the deployed site or the GitHub repo, where you can read more about the project objectives.
Bike Skills Game
To practice the skills that we were learning in class, such as using react state, turnery operators, props, spread syntax, I wrote a React JS version of my Python Bike Skills Game which takes you on a journey to remind you to practice many times before you attempt a dangerous move. It also holds a little joke about cyclists never owning enough bikes.
To Do List
In our She Codes React JS modules, we created a To Do List App, which helped to me to further understand react functional components, react state, map method, turnery operators, spread syntax, props and splice.
