Reddit + Redux
Reddit + Redux is a React application built as a minimalistic reddit application. The project was written using React, Redux, and the Reddit JSON API.
- TypeScript
- React
- Redux
- Netlify
Web Stack and Explanation
Going into this project, I knew there would be a lot of state variables related to different subreddits and posts received from the reddit JSON API, so I wanted to use Redux as a reliable state management tool. This in turn made me choose React due to the smooth workflow between Redux and the official React bindings, React-Redux.
Additionally, I chose to use TypeScript for this project, because the Reddit JSON API is poorly documented and I knew I'd have trouble keeping track of the different data types received from GET requests. TypeScript forced me to be methodical about the data I was requesting and provided a level of sanity during debugging.
Netlify was chosen for hosting the application due to its seamless and reliable experience with React applications.
Problems and Thought Process
Like all worthwhile projects, there will be challenges and hiccups along the way. Due to the project's size and amount of data provided by Reddit, I ran into difficulty keeping an organized and maintainable code structure.
In order to correct this, I strove to keep React components as small, simple, and reusable as possible. I also utilized Redux slices to split up the Redux store and used the power of react hooks to only select portions of the entire application state that were needed.
Lessons Learned
Early on I decided that I would use CSS class modules for styling the website, so that I could contain CSS to individual components. I was quickly humbled by how easy it is to make chaotic and large CSS files that are difficult to debug when one small component is not positioning correctly. Writing elegant CSS is truly an art form and I would not dare say I achieved elegance with mine, but I learned a valuable lesson on trying to keep CSS files as simple as possible.
Check out my other projects
Dev Doodles
Full-Stack e-commerce PERN app