Made by Artem Gusev as a Shopify Frontend Challenge Fall 2022
Website link: https://shopify-front-challenge.pages.dev
This application is made using React. Out of additional challenges I did:
- Saving data on page reload
- Giving the possibility to users to choose the AI engine
Big thought was given to semantics and accessibility.
All headings are <h1> or <h3> where needed, buttons are actually <button> elements and text is located in <p> tags
In addition, clicking Enter will also submit the AI request.
The application also has Error Handling. If the OpenAI is inaccessible or API key is incorrect, the app will alert about it.
For styling, the React-Bootstrap + Styled Components combination was used.
That allowed to have a quick and adaptable UI development workflow with the customization of Styled components
Saving on reload is implemented through browser Local storage and for instant UI updates without page reloading and data transfer, the React Context was used.