React Project - Initial Idea (Part 1)

I’ve been meaning to learn React for quite a while now. I thought of this project two months ago but lost traction not too long after. I’ll be using this library for work, so it is about time for me to bring back life into this project.

Project Idea

        I wanted to create something that I would be useful and possibly help my community. I thought that it would be helpful to have a website that would list out coupons and deals given by local grocery stores. Although I already moved to NYC, I want to focus my efforts on stores in North Philadelphia, where I initially had this idea. In my first attempt at this project, I knew that I would need to write a web scraper. This was my first roadblock. I tried to scrape information from ShopRite and was immediately blocked. The website is secured by Cloudflare and it seems impossible to get past this. This is especially so since I do not have too much knowledge in networking. Eventually I want to create an API to do this web scraping. But for the objective of this project (to learn React), I will focus on the website front-end and UI.

Website UI

        Designing the website is one aspect of this process that excites me. I’m using Figma to do the prototyping. I also am excited to create the screens using a pretty color palette. I autogenerated the colors: A7CECB (Opal), 8BA6A9 (Pewter Blue), 75704E (Gold Fusion), CACC90 (Sage), F4EBBE (Lemon Meringue). I think that I got lucky on this first randomized set. These colors remind me of food and I love the neutral pastel tones.

Ambitious Future Versions

        There are tons of other things to consider, and I honestly don’t know what I will focus on next. I want the first version of this website to be simple. I’ll ask the user for their location (the only option will be Philadelphia), then a list of the latest coupons will appear for local grocery stores. I also have to think of a project name and where to host the website. In later versions, I want to include account creation, allow people to save and list the items they have in their fridge (a feature that I would want for personal use ). Note that there are way more additions to consider but I will not be doing that at this time.

        This is also the first project that I will be documenting the process on, personally I don’t like showing projects until they are completed but I think this will be good for future reflection and to see what mistakes I made as a young developer