http://bc-vape-finder.herokuapp.com/
BC Vape Finder is a search portal for vaping-related products that are sourced from e-vendors across the lower mainland
(the page may take up to 10~ seconds to load if not accessed recently)
I developed this project to demonstrate my full-stack web development skills. Tasks include:
- combining a modern UI framework with the Apollo and Realm APIs to fetch content from a cloud-hosted datastore using GraphQL
- discovering content by scraping e-commerce websites, cleaning and loading the data into Atlas
- performing compatibility testing using BrowserStack,LambdaTest to ensure proper functioning on all modern browsers for mobile/desktop
- Filter products by categories, brands, and/or e-store tags using the respective dropdown menus
- or alternatively, type a tag name into the input box
- Sort by highest or lowest price
- Search results from previous queries are cached
Desktop | Mobile |
---|---|
- Each product card contains a direct link (with an age vertification popup) to the product source page
Desktop | Mobile |
---|---|
- Load the next page of results when the end of the current page is reached
Desktop | Mobile |
---|---|
- Contains project description, contact form , disclaimer, and icon links to frontend/backend implementation technologies
Desktop | Mobile |
---|---|
- apollo-client
- graphql
- realm-web
- react-router
- emailjs
- react
- react-icons
- react-responsive
- react-transition-group
- integrate a CSS preprocessor such as SaSS, use styled-components
- change hosting provider from Heroku to Netlify