Your Web News in One Place

Help Webnuz

Referal links:

Sign up for GreenGeeks web hosting
May 13, 2021 10:25 am GMT

Build Website with ReactJS, Styled-components and GSAP for Scrolling Animations

Hi there,

Recently, I saw an website with cool scrolling effects and so I have decided to create website in ReactJS with cool scrolling animations using GSAP.

Here is the Demo Link:
https://agency-website-eta.vercel.app/

For this project I have used these libraries,
reactjs
GSAP for scrolling animations
Styled-Components
React-slick and slick-carousel for Carousal

First I have created design in Figma, and used some of it's awesome plugins and resources. I have listed all the resources used in this website in the github ReadMe file.

Here is the tutorial how I have created this website!

Things that I have learned building this project,
Good Folder structure for React Projects
How to create Hamburger Menu with only css
How we can leverage advantages of component structure
How to use GSAP in React JS for awesome animations while scrolling
Uses of Lazy and suspence in reactJS
Many awesome CSS animations etc.

You can use this to learn or for your portfolio and if you want to use it else where small credit would be appreciated (not compulsory), just check license of all images and other assets before using it commercially.

I will try to improve it's speed and performance.
I haven't added react-router yet but if you want to create more pages then you can add it and feel free to create more sections.

Any suggestions are welcomed!

Thanks For Reading

Feel free to visit my youtube channel:

@CodeBucks

Follow me on Instagram where I'm sharing lot's of useful resources!

@code.bucks


Original Link: https://dev.to/codebucks/build-website-with-reactjs-styled-components-and-gsap-for-scrolling-animations-2f10

Share this article:    Share on Facebook
View Full Article

Dev To

An online community for sharing and discovering great ideas, having debates, and making friends

More About this Source Visit Dev To