Project name: napcamp
Link to live site: https://napcamp.herokuapp.com/
Summary: Napcamp is clone of hipcamp. Napcamp offers busy people places to take naps. From public beds in Ikea to curbside free mattresses, you can find any type of napping arrangment that fits your needs. Users can read, create, delete and edit their bookings as well as create, edit and delete their reviews. Users can also search for locations where bookings are available.
Technologies used: react, redux, node.js, sequelize, postgres
Languages: javascript, jsx, css and html
Future goals/to-dos: The app's handling of updating and deleting bookings and reviews could be refined so that it fits hipcamps implimentation of these features more.
Technical Implementation: I had to focus a lot on how I was extracting different pieces of data in many different components. I had three database tables and all were highly linked through foreign keys so the logic got a bit tricky for me at times.
I enjoyed doing the search bar functionality also. I set a state variable equal to the text being typed in the search bar. On submit, a thunk action takes the search text and makes a fetch request for all spots where the location matches the search. The store reducer takes away all spots that don't match the location so that spots with matching locations are only rendered.
Some other challenges that I went through have to do with stlying and how to precisely align things on a page layout. I have a hard time getting everything exactly where I want it sometimes.
The last challenge had to do with thinking about slices of state and how to render updated states after fetch requests return a 200 response. Once I got the jist of how the data was flowing from the frontend to the backend and back to the front it got easier. But it took some time to think about the process as a whole.