Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/ladunjexa-pbl/vanillajs-sushi

"Vanilla Sushi" Web - amazing animated japanese food responsive website with Vite.js using Vanilla & JavaScript ๐Ÿฃ
https://github.com/ladunjexa-pbl/vanillajs-sushi

animated-web aos pure-html-css-js responsive-website vanilla vite-vanilla-js

Last synced: 25 days ago
JSON representation

"Vanilla Sushi" Web - amazing animated japanese food responsive website with Vite.js using Vanilla & JavaScript ๐Ÿฃ

Awesome Lists containing this project

README

        


![Project Banner](readme_assets/readme_banner.png#gh-dark-mode-only)
![Project Banner](readme_assets/readme_banner-light.png#gh-light-mode-only)

Vanilla Sushi Web




Well-designed animated japanese food responsive website - built with Vite.js using Vanilla & JavaScript (Pure HTML,CSS).



contributors


last update


forks


stars


open issues


license




View Demo
ยท
Documentation
ยท
Report Bug
ยท
Request Feature



# :notebook_with_decorative_cover: Table of Contents

- [About the Project](#star2-about-the-project)
* [Folder Structure](#bangbang-folder-structure)
* [Tech Stack](#space_invader-tech-stack)
- [Getting Started](#toolbox-getting-started)
* [Installation](#gear-installation)
* [Run Locally](#running-run-locally)
- [Contributing](#wave-contributing)
- [License](#warning-license)
- [Contact](#handshake-contact)
- [Acknowledgements](#gem-acknowledgements)

## :star2: About the Project





This repository houses an "Vanilla Sushi" Web - amazing animated japanese food responsive website with Vite.js using Vanilla & JavaScript and AOS for animate on scroll - using BEM Methodology ๐Ÿฃ

### :bangbang: Folder Structure

Here is the folder structure of VanillaSushi.
```bash
Vanila-Sushi-Web/
|- assets/
|- css/
|-- sections/
|-- about.css
|-- footer.css
|-- header.css
|-- hero.css
|-- popular.css
|-- subscribe.css
|-- trending.css
|-- style.css
|- js/
|-- script.js
|- public/
|- .gitignore
|- index.html
|- package.json
```

### :space_invader: Tech Stack

[![My Skills](https://skillicons.dev/icons?i=html,css,js)](https://skillicons.dev)

(back to top)

## :toolbox: Getting Started

### :gear: Installation

#### Step 1:
Download or clone this repo by using the command below:

```bash
https://github.com/ladunjexa/Vanilla-Sushi-Web.git
```

#### Step 2:

This webapp using NPM (Node Package Manager), therefore, make sure that Node.js is installed by execute the following command in console:

```bash
node -v
```

#### Step 3:

In root folder execute the following command to get the required packages:

```bash
npm install
```

### :running: Run Locally

#### Step 1:

Go to root folder and execute the following command in order to run the webapp:

```bash
npm run dev
```

(back to top)

## :wave: Contributing



Contributions are always welcome!

See [`contributing.md`](https://contributing.md/) for ways to get started.

Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are **greatly appreciated**.

If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement".
Don't forget to give the project a star! Thanks again!

1. Fork the Project
2. Create your Feature Branch (`git checkout -b feature/AmazingFeature`)
3. Commit your Changes (`git commit -m 'Add some AmazingFeature'`)
4. Push to the Branch (`git push origin feature/AmazingFeature`)
5. Open a Pull Request

(back to top)

## :warning: License

Distributed under the MIT License. See [LICENSE.txt](https://github.com/ladunjexa/Vanilla-Sushi-Web/blob/main/LICENSE) for more information.

(back to top)

## :handshake: Contact

Liron Abutbul - [@lironabutbul6](https://twitter.com/lironabutbul6) - [@ladunjexa](https://t.me/ladunjexa)

Project Link: [https://github.com/ladunjexa/Vanilla-Sushi-Web](https://github.com/ladunjexa/Vanilla-Sushi-Web)

(back to top)

## :gem: Acknowledgements

This section used to mention useful resources and libraries that used in CreativAI Webapp:
- [Vite.js](https://vitejs.dev/)
- [AOS](https://michalsnik.github.io/aos/)
- [Google Fonts](https://fonts.google.com/)
- #JSMastery

(back to top)