Scaling the Flatiron summit with StackStore: running with React, Redux and Rails
Wednesday 22 September 2021 / coding
The task for the final project is to build a React/Redux app with a Rails API backend. I decided to create StackStore, a simple application for finding, keeping, tagging and making notes on Stack Overflow questions. With StackStore, you can:
- search for Stack Overflow questions by title
- view questions and answers
- save questions to your own store
- add tags and notes to questions and view questions by tag
It seems like a fairly simple app when you list the features - and the entity relationship diagram below is indeed much simpler than my last few apps - but some of the best apps are narrow in scope. The entity relationship diagram below is for the API backend; you can also open the diagram as a PDF.
The full requirements for the project were as follows:
- use of ES6 syntax
- use of
- one HTML page to render the app - I ended up with two, one of which is a 404 used to run a redirect script (not my own) when GitHub Pages tries to load a route via a non-existent HTML file
- at least five stateless components and three routes - I ended up with many stateless components and seven routes: home/login, about, saved questions, edit question, tags, saved questions by tag and search
- RESTful routing using React Router
- use of Redux middleware to control state - I used this except for managing the values of controlled forms before submission
- async actions with fetch requests using Redux Thunk
fetchsyntax (not jQuery)
- display handled by front-end
Throughout my Flatiron journey, I tended to have an initial sense of challenge about the projects and their requirements, not least because they often require putting together a number of different elements that the taught curriculum has covered in isolation. However, despite the challenge, I've always pushed myself to make a useable product and in the process learn new stuff as my idea would organically evolve during the development process. As a result, I end up feeling pretty confident by the end of each project, not only in want I've learnt through the curriculum, but in full-stack development and coding more broadly. Now it's time to advance the challenge one step further as I start looking for opportunities to pursue a professional career in coding.
Below is a demo of the app, which is hosted on Heroku and GitHub (Pages) and can be accessed via stackstore.yndajas.co (you will be redirected to GitHub).