Skip to content

MozerBuce/animationsdemo-faust.js-and-aoslibrary

Repository files navigation

Description

Welcome to our project! This is a small demo showing how can you easily use the Animations on Scroll Library with headless wordpress in the backend and faust.js in the frontend. With the knowledge gained here you can use it for React.js and Next,js projects.

About few weeks ago, i was working on a wordpress headless project and one of the main goal was to set animations on scroll, during my researches i found AOS Library, i had to perform some tests of the usage before implementing it in the main project, so i decided to improve it and share here.

Basically this project just shows different animations on the componentes when your scroll down or up, but you can set it to what you what and have different animations.

Technologies

  • Actually, this is the legacy version right now but you can find the stable one here
  • Actually, wordpress is not headless, but if you follow the instructions provided on faust.js documentation you will turn it.

Install and run the project

To have this project running on your local environment, you just need to follow the steps below:

  1. Clone the project
git clone https://github.com/MozerBuce/animationsdemo-faust.js-and-aoslibrary.git
  1. Install all dependencies
npm install
  1. Run the project
npm run dev
  1. Connect to wordpress

    At this point you will have the project running on your local machine, but only the frontend and the animations, if you want to have dynamic information from the backend, wordpress, you need to turn your wordpress into headless and connect it to the frontend and you can follow the steps provided here to achieve this.

About

Testing animations on scroll using faust.js and aos library for a real project

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published