View Code? Open in Web Editor
NEW
Home Page: https://quattro-pizza.vercel.app
HTML 4.62%
TypeScript 59.59%
SCSS 35.79%
quattropizza's Introduction
- Типізація - Type Script.
- Реалізовані сторінки Піци, Десертів, Напоїв, Кошику та Сторінка Доставки.
- Маршрутизація між сторінками.
- Отримання даних з API за допомогою RTK Query.
- Сортування продукції за опціями, ціною та алфавітом.
- Регуляція ціни в залежності від вибраних параметрів.
- Додано Redux логіку кошику.
- Групування елементів кошику за параметрами.
- Сторінка доставки з формою заповнення даних валідована за допомогою React Hook Form.
- Зберігання даних у localstorage за допомогою Redux Persist.
- Сповіщення користувача React Toastify.
- Лодери React-Spinners.
- За стилізацію відповідає SCSS.
Як підготувати та запустити проєкт
- Переконайтеся, що на комп'ютері встановлено LTS-версія Node.js.
Скачай та встанови її якщо потрібно.
- Клонуй цей репозиторій.
- Встанови базові залежності проекту командою
npm install
.
- Запусти режим розробки, виконавши команду
npm start
.
- Перейди у браузері за адресою http://localhost:3000.
Ця сторінка автоматично перезавантажуватиметься після збереження змін у файли проекту.
🛠 В роботі були використані бібліотеки:
- React JS
- Type Script
- Redux Toolkit
- Redux Toolkit Query
- React Router v6
- Redux Persist
- React Select
- React Spinner
- React Toastify
- React Hook Form
![App Screenshot](https://camo.githubusercontent.com/53ab5fd14767758d0c02d246d13bf0dab7120af4abf759bcb24a9912578bb85d/68747470733a2f2f643364656874646d7032727763772e636c6f756466726f6e742e6e65742f6d735f3536303935342f5a3669304c4236504b7561766e313971564d565859756a4b4765697879322f253235443025323541312532354430253235424425323544302532354238253235443025323542432532354430253235424525323544302532354241253242253235443125323538442532354430253235424125323544312532353830253235443025323542302532354430253235424425323544302532354230253242323032332d30332d30382532423138353731362e6a70673f457870697265733d31363830353330343030265369676e61747572653d494d67596130484d393335506a464b5a3771306b614b5835345a58736858564a646a317837684331456e55564d74524d56684e69374d4c664c7439537e535a364b6634427639506c436374372d78724a502d546461573362707034386a4a5456564c68526862712d6c686e584c4a6d6237324735545334543463356e71713244686953464a6475683134397957776770555354553168487a5233627038676279744b4d6c4147654b49426c4e325264576c46395248344735744c68736e6b7e51535644437941774d4c6d564e484b6e624539654b7252643277367a7a4766597e547e57497e4b527966727732707a6e59646445354a6345484b785479356a6d50422d4c392d545055355a2d4a6d47736b66696b2d526c586531726d6c727374354a76754f3178514878657a5145747a4b6c714c2d4f547957475079786250737e54697366747e577469634277447a326c4242416a75775f5f264b65792d506169722d49643d41504b414a42434759515955524b484247434f41)
![App Screenshot](https://camo.githubusercontent.com/c0a098486c597ed8b0cab7b743103dd095253aebc46a224b9316d8a73e16df48/68747470733a2f2f643364656874646d7032727763772e636c6f756466726f6e742e6e65742f6d735f3536303935342f64746c4f4d596d4c62676244445158745731616f39374a303462673478522f253235443025323541312532354430253235424425323544302532354238253235443025323542432532354430253235424525323544302532354241253242253235443125323538442532354430253235424125323544312532353830253235443025323542302532354430253235424425323544302532354230253242323032332d30332d30382532423138353535392e6a70673f457870697265733d31363830353330343030265369676e61747572653d53723330754942754b6e75706c576a386d6f4471615a62314d414a726230776c7858676c4b6e6441566d4e79544e524a37346469307643565a43704b5266613333457e4753646d37452d314448563966505064786662456c6637756d396757393374416e6634706549394c416b4b5753794d654663574a766769544a49694c787232547265746746423548787546496c6b6c4948736b38753136633631766e58676c526a56724c7443783951727a3443777a49796b744265414758464b584a2d686337544a4e506a327066586a356577383951567162644f6c364d6b4f7475684e6a6c796847695670474777594862514a79307a484e4a4d584a426d307754475361544159444c7a377538736b324e526952555976576952735861695a67677864716454674431634731644f38446641356d64454631425356765a6c626c626566325554433673637e464d5567576a4236527e5141515f5f264b65792d506169722d49643d41504b414a42434759515955524b484247434f41)
![App Screenshot](https://camo.githubusercontent.com/002ed79391548a1e948eeb3fe6ef3d8694473cfb0bd13d28a6bcf0019fe1e8ed/68747470733a2f2f643364656874646d7032727763772e636c6f756466726f6e742e6e65742f6d735f3536303935342f634f586d325866726678376971306f49306463736337384c61514e3358682f253235443025323541312532354430253235424425323544302532354238253235443025323542432532354430253235424525323544302532354241253242253235443125323538442532354430253235424125323544312532353830253235443025323542302532354430253235424425323544302532354230253242323032332d30332d30382532423138353530312e6a70673f457870697265733d31363830353330343030265369676e61747572653d5a424652657e77394c6e5a645a4c6d43634369664638334a4a6a62777e6e4d2d48586342612d3634427257724b354e6d4661464a6b4c4555753546415773327e45796c5532616466476c77694a6f76336e304f67384135706669456376766e33727945373168306e4c476c3554784b585157314570624a7a54686b434a6e356437706f714b6d4b786d6d4664795056735067344357792d476d3038774845304d6a566a6c68727468566a6d534355753049386f4d6f53542d6752667878586e615268746f4f3063794336612d616d752d6458744f2d4a725a656430714563496a474b7459747838387145516a3143505765455a6e4735734d56627a4569334a42714e4f7234373564472d645a6f56436c7e4b6f554f57764136465437687a5243544e64584d74323858425a6869704f356866712d51363056446a4836417569374c4b5577382d76427e546b395677647a5245345454775f5f264b65792d506169722d49643d41504b414a42434759515955524b484247434f41)
![App Screenshot](https://camo.githubusercontent.com/e4da7bc03cd27655bfda6b648a8cb2a9cb1c75577f20966e77173773a05eb285/68747470733a2f2f643364656874646d7032727763772e636c6f756466726f6e742e6e65742f6d735f3536303935342f467952546b533471767977547567556151343950726f767948796c5a30642f253235443025323541312532354430253235424425323544302532354238253235443025323542432532354430253235424525323544302532354241253242253235443125323538442532354430253235424125323544312532353830253235443025323542302532354430253235424425323544302532354230253242323032332d30332d30382532423138353835382e6a70673f457870697265733d31363830353330343030265369676e61747572653d73437e77724975496d72677532336e343670443041744a644c7a7e566634367a565044655a334b396d34666154534a6b39424e542d6c6e4b31374475486575326357465a3762315773397976764663337847345263474a564959374a633041386f44585338416e6242696c79357843486263416c6c7e785143414c44306845724876756372586f5a37336a7666767777394653537e323653414751784c2d53516f6c4941486241776b624662636f632d5750377742726c6365386f2d4632456f4349615748624a32494167744c457e75656a594c354d41687233747767395236442d485546494939637635477e47344e456b544630556169467e786c374c68626364577e5337615a464555447a71457e39334563306665454a4c2d384774493943676a747a39656d37726d357731444e744c4b65495375626a54574f6a75314f7839524b56354445676e58475646394d5a4e624d38515f5f264b65792d506169722d49643d41504b414a42434759515955524b484247434f41)
quattropizza's People
Contributors
Stargazers
Watchers