This project is available online for your convenience:
NOTE: I knocked up the server/domain super quick this morning, so it's possible that the DNS for the domain has not yet propagated, just in case you cannot access the domain. It seems fine on my end.
I decided to go with a vibrant gradient background to represent the brand of the website. I think it makes the website feel more organic and more like a native application, rather than a static backdrop of information.
The orange and pink are philosophically meant to represent the feeling of "fruit in the morning", which ties into this idea of healthy eating (aka broccoli). The problem is that green isn't a particularly appetising, nor necessarily appealing colour, which is why we need to use associated colours to try and convey Broccoli's brand message.
On another level, the orange coming in from the top-right hand corner is also meant to represent the morning sun, casting a shadow over the thick animated bezel of the primary button, creating this kind of "tropical nirvana" on your computer screen.
I know, folks.
It all sounds very wanky, but I think these are the reasons why the website feels complete.
- Added a Recaptcha to the form.
- Added a close button to the popup form.
- The automated testing is lacking (and blatantly not present in some areas). This is one of my primary weak points that I would like to grow and be mentored on. In addition, I just didn't have the time.
- The CSS is not as neat as it could be, but I didn't really have the time to refactor and make things pretty.
- Would have liked to do more cross-browser testing, and I managed to pick up a few bugs, but again, was a little short of time.
This application was built using Create React App. It utilises MobX for state management and Axios for making HTTP requests. It has been deployed online using Now.
In order to setup this application, please go to the root folder of this repository and install all required dependencies:
git clone https://github.com/dottjt/broccoli-co.git
cd broccoli-co
yarn installIn order to run the application in development mode on port http://localhost:3000:
yarn startIn order to build the application and build static files for production:
yarn buildIn order to run automated tests please run:
yarn test