Cape Gadgets
https://capegadgets.co.zaEcommerce
This was a website I built when I lost my job at the start of the pandemic in 2020. The website is an ecommerce store catering to university students in South Africa. The website mostly sells electronic goods like laptops and cellphones as well as other consumer electronics
Challenges:
The main challenge I faced was how to interface with the payment gateway. The customers that we were serving use a special government funded wallet in order to pay for their goods and services. As such the documentation for the api was difficult to use and there was not much information on how to use it with React.
Stack:
NextJS
Supabase
Postgres
Javascript
TailwindCSS
APIs:
Rest API
Intellimali
Google Analytics
Facebook Conversions API
Hotwater24
https://hotwater24.comMarketing & Lead Generation
This is one of my freelance projects that I built from the ground up. The main aim with this website was help the customer generate leads from web traffic in order to get qualified leads so that the customer could sell LPG powered Geysers. The website also provides information about the right size of gas geyser should be installed in their home.
Challenges:
A challenge with this website was to create a good multi-step form because the customer needs to provide a lot of information in order to generate an accurate cost estimate for their geyser installation
Stack:
NextJS
Supabase
Postgres
Javascript
TailwindCSS
APIs:
Rest API
Paygate
Contentful
Sendgrid
Google Analytics
Facebook Conversions API
Ink Finance
https://inkfinance.co.zaLead Generation
This is a website for users looking for Cash Loans to apply by entering their personal details as well as submitting financial documents. The administrator of the website also has to be able to view these documets online in order to make the decisions about who to grant the loans to.
Challenges:
The main challenge on this website was storing the documents because each potential customer needed to submit numerous documents.
Stack:
NextJS
Supabase
Postgres
Javascript
TailwindCSS
APIs:
Rest API
Google Analytics
Facebook Conversions API
Solarquest
https://solarquest.co.zaMarketing & Lead Generation
This is a marketing & lead generation website so that customers can show their interest in installing Solar Power & Battery Backup solutions in their home or office. Once a customer has filled in the form to show their interest their details are saved in the Postgres database and then sent on into the Pipedrive CRM via the pipedrive API for the sales team to follow up.
Challenges:
The challenges in this website was integrating the Pipedrive api but the documentation was quite helpful in this process since the documentation was quite good.
Stack:
NextJS
Supabase
Postgres
Typescript
TailwindCSS
APIs:
Rest API
Pipedrive
Google Analytics
Facebook Conversions API
African Expressions
https://african-expressions.vercel.app/Marketing
This is a website to show the different types of wool that a the distributor has for sale to retailers. It also serves as a directory of where you can buy the wool from different retailers and it shows the reatailers contact info as well as their location on a Map
Challenges:
The challenge with this website was constructiing the filter for the defferent types of wools sold by distributor. The wools could be filtered by type, category and stictching
Stack:
NextJS
Supabase
Postgres
Javascript
TailwindCSS
APIs:
Rest API
Mapbox API
Google Maps API
Script Beauty
https://www.scriptbeauty.co.zaMarketing
This is a marketing website for a service to be provided to social media influencers. The website is introducing the idea of help influencers get in touch with brands for promotional purposes
Challenges:
This one was a not so much a challenge as it was a simple marketing website without the need for too much functionality required yet.
Stack:
NextJS
Typescript
TailwindCSS
APIs:
Rest API
Art Gallery
https://art-gallery-sage.vercel.app/Marketing
This was a simple excercise on Frontend Mentor fo me to practise some skills in taking a design and then replicating it in my code.
Challenges:
The challenge with this site was in knowing how to deconstruct the website layout so that I could know what CSS to write and to make sure the responsive styles were right and resembled the design.
Stack:
NextJS
Typescript
TailwindCSS
APIs:
None