GPT-3

A mordern static landing page

A mordern landing page designed for an Artificial Intelligence company

Live Website:

http://gpt3-website-azure.vercel.app/

Tools

The website was built using the following tools and the following reasons:

• React JS: to harness the power of single page applications and reuseable components
• AOS: the animate on scroll library is used to animate the website elements
• React Icons: for importing icons used on the website
• CSS: for styling the website

Challenges

The main challenge I encountered while building this project was background propagation and setting scroll-padding in React.

Features under development

• Implementing scoll padding

Future Improvements

• Replacing links with Link, NavLink and defining Routes
• Creating a backend to fetch blog
• Making the website dynamic instead of static

Development

File Structure

├── README.md
├── package-lock.json
├── package.json
├── public
│   ├── favicon.ico
│   ├── index.html
│   ├── logo192.png
│   ├── logo512.png
│   ├── manifest.json
│   └── robots.txt
├── src
│   ├── App.css
│   ├── App.js
│   ├── assets
│   │   ├── ai.png
│   │   ├── atlassian.png
│   │   ├── blog01.png
│   │   ├── blog02.png
│   │   ├── blog03.png
│   │   ├── blog04.png
│   │   ├── blog05.png
│   │   ├── dropbox.png
│   │   ├── google.png
│   │   ├── logo.png
│   │   ├── logo.svg
│   │   ├── people.png
│   │   ├── possibility.png
│   │   ├── shopify.png
│   │   └── slack.png
│   ├── components
│   │   ├── article
│   │   ├── brand
│   │   ├── cta
│   │   ├── feature
│   │   ├── index.js
│   │   └── navbar
│   ├── containers
│   │   ├── blog
│   │   ├── features
│   │   ├── footer
│   │   ├── header
│   │   ├── index.js
│   │   ├── possibility
│   │   └── whatGPT3
│   ├── index.css
│   └── index.js
└── yarn.lock

Credit

Original Figma design gotten from AR Shakir: https://www.arshakir.com/

License

MIT

Free Software? Hell Yeah!