Ecosyste.ms: Awesome

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

Awesome Lists | Featured Topics | Projects

https://github.com/ibrahimalsabr/lespetitsplats

Les Petits Plats is an interactive cooking recipe platform. The project has evolved from a cookbook publishing house to a rich and interactive website where users can easily find, filter, and explore recipes thanks to an advanced search engine and an optimized user interface.
https://github.com/ibrahimalsabr/lespetitsplats

css dynamic dynamic-programming filter filter-lists filtering html java js json npm-package sass sass-framework

Last synced: 13 days ago
JSON representation

Les Petits Plats is an interactive cooking recipe platform. The project has evolved from a cookbook publishing house to a rich and interactive website where users can easily find, filter, and explore recipes thanks to an advanced search engine and an optimized user interface.

Awesome Lists containing this project

README

        

# LesPetitsPlats : une plateforme interactive de recettes de cuisine

![Logo LesPetitsPlats](./assets/logo-md.png)

[ Read this file in English](./README.md)

## Description

Les Petits Plats est une plateforme interactive de recettes de cuisine. Le projet a évolué d'une maison d'édition de livres de cuisine à un site web riche et interactif, où les utilisateurs peuvent facilement trouver, filtrer, et explorer des recettes grâce à un moteur de recherche avancé et une interface utilisateur optimisée.

## Fonctionnalités

- **Recherche dynamique :** Les utilisateurs peuvent rechercher des recettes par mots-clés, ingrédients, ustensiles, et appareils.

- **Filtrage avancé :** Permet une recherche détaillée grâce à des filtres spécifiques intégrés dans l'interface.

- **Interface conviviale :** Conçue pour une expérience utilisateur fluide, avec des réponses rapides et des interactions intuitives.

## Technologies Utilisées

![HTML5](https://img.shields.io/badge/HTML5-E34F26?style=for-the-badge&logo=html5&logoColor=white)
![CSS3](https://img.shields.io/badge/CSS3-1572B6?style=for-the-badge&logo=css3&logoColor=white)
![JavaScript](https://img.shields.io/badge/JavaScript-F7DF1E?style=for-the-badge&logo=javascript&logoColor=black)
![SASS](https://img.shields.io/badge/SASS-CC6699?style=for-the-badge&logo=sass&logoColor=white)
![Node.js](https://img.shields.io/badge/Node.js-43853D?style=for-the-badge&logo=node-dot-js&logoColor=white)
![JSON](https://img.shields.io/badge/JSON-000000?style=for-the-badge&logo=json&logoColor=white)
![npm](https://img.shields.io/badge/npm-CB3837?style=for-the-badge&logo=npm&logoColor=white)

## Design

Le design de _LesPetitsPlats_ a été pensé pour offrir une expérience utilisateur intuitive et esthétiquement agréable, tout en mettant en avant les œuvres des recettes.

### Captures d'écran

Voici quelques captures d'écran qui illustrent le résultat final du site :

![Page d'accueil](./assets/Home.png)

Ces images donnent un aperçu du design interactif et réactif du site.

## Installation

Suivez ces étapes pour installer et exécuter le projet _LesPetitsPlats_ sur votre machine locale pour le développement et les tests.

### Prérequis

Assurez-vous d'avoir Node.js installé sur votre machine. Si ce n'est pas le cas, vous pouvez le télécharger et l'installer depuis [Node.js official website](https://nodejs.org/).

### Clonage du dépôt

Ouvrez votre terminal et tapez la commande suivante pour cloner le dépôt GitHub :
`git clone https://github.com/IbrahimAlsabr/LesPetitsPlats.git`

### Installation des dépendances

Changez de répertoire pour accéder au dossier du projet cloné et installez les dépendances nécessaires :

`cd LesPetitsPlats`

`npm install`

### Lancement de l'application

Ouvrez `index.html` dans votre navigateur

## Auteur

### Ibrahim Alsabr

[![GitHub](https://img.shields.io/badge/GitHub-100000?style=for-the-badge&logo=github&logoColor=white)](https://github.com/IbrahimAlsabr) [![LinkedIn](https://img.shields.io/badge/LinkedIn-0077B5?style=for-the-badge&logo=linkedin&logoColor=white)](https://www.linkedin.com/in/ibrahim-alsabr-188939231/) [![Twitter](https://img.shields.io/badge/Twitter-1DA1F2?style=for-the-badge&logo=twitter&logoColor=white)](https://twitter.com/home?lang=fr)