Animais Fantásticos (Fantastic Beasts) is a website project developed during the JavaScript ES6 course at Origamid.com. This project showcases a variety of skills learned by creating various effects from scratch using JavaScript.
Click here to see a live demo of the website.
Following closed instructions, this project demonstrates a mastery of front-end development with JavaScript, showcasing creativity and practical application of programming knowledge. With every script developed from scratch, such as a login modal, a dropdown menu to help navigate to different sections, and a smooth scroll with animations to enhance the user experience. A frequently asked questions (FAQ) list is also implemented with a show/hide system using JavaScript.
To further showcase the capabilities of JavaScript, a custom API is created to display the numbers of each animal in the Fantastic Beasts world. In addition, the project includes contact information, with a Bitcoin API integrated to display real-time donation values and a fictitious map with a tooltip containing directions and instructions.
- HTML
- CSS
- JavaScript
- Responsive design using CSS Grid Layout and Flexbox
- Clean and modern layout
- Easily customizable
- Custom API for animal list and amount
- Slide gallery with all animals
- BTC API to display donation price
To get started with this project, follow these steps:
- Clone the repository:
git clone https://github.com/Barata-Ribeiro/animais-fantasticos.git
- Navigate to the project folder:
cd animais-fantasticos
-
Open the
index.html
file in your browser or use LiveServer. -
Explore and modify the code to suit your needs.
If you find any issues or have suggestions for improvements, feel free to open an issue or submit a pull request.
- After cloning the repository, run the script to install dependencies:
npm install
- Then you create a branch of the project:
git checkout -b branch-name
- Run the
dev
script to update live.
npm run dev
-
Make all the necessary changes to the project...
-
Stop the
dev
script and run thebuild
script:
npm run build
-
Commit your changes and push to main repository.
-
Create a pull request...
This project is released under the MIT License.