Releases: areallypawa/pizzaandkapibara.github.io
Pizza And Kapibara site V3.1
Pizza And Kapibara site V3.0
🔷 Pizzeria "Pizza and Capybara" school project VERSION 3.0! | Пиццерия "Пицца и Капибара" школьный проект ВЕРСИЯ 3.0!
🔹 Hello everyone I am glad to congratulate everyone that the new version of my project has been released! So, what innovations have I introduced?
🔹 Всем привет! Я рад всех поздравить, что вышла новая версия моего проекта! Итак, какие же нововведения я внес?
🔷 List of changes in version 3.0 | Список изменений в версии 3.0
▶️ Created two bots in Telegram.
Since I started to introduce interaction with telegrams, I decided to finish this idea to the end. I was faced with a new task - the functionality of the bot in telegram. I have never worked with bots in telegram before, only in online constructors. Realizing that the designer's site was not enough for me, I started writing a bot in Python. Why Python? Because it is a convenient and understandable programming language that I have known for 2 years. After studying the material that is needed to create bots in telegram using the pyTelegramBotAPI library, I wrote two bots. The first is the identifier. The bot can send a link to the group if the person sends the correct password. The second one is a bot for the group. He also monitors the pressing of the "Confirm" and "Delete" buttons and can pin the message or delete it.
In order for the bot to work almost constantly, hosting is needed. Unfortunately, I did not find a normal hosting, but I found a way to run bots at any given time, even without a computer nearby. ReplIt is a platform for posting your code, editing it, and developing it with someone. Thanks to the convenient mobile application, the code can be edited and run whenever you want.
▶️ Создал двух ботов в телеграмм.
🇷🇺 Так как я начал вводить взаимодействие с телеграмм, то я решил доделать эту идею до конца Передо мной встала новая задача - функционал бота в телеграмме. Прежде я никогда не работал с ботами в телеграмме, только в онлайн-конструкторах. Поняв, что сайта конструктора мне не хватит, я принялся писать бота на Python. Почему Python? Потому что удобный и для меня понятный язык программирования который я знаю уже 2 года. Изучив материал который нужен для создания ботов в телеграмме при помощи библиотеки pyTelegramBotAPI, написал двух ботов. Первый - аунтификатор. Бот может прислать ссылку на группу, если человек отправит верный пароль. Второй - бот для группы. Он же, отслеживает нажатие кнопок "Подтвердить" и "Удалить" и может закрепить сообщение или удалить его.
Для того, что бы бот работал почти постоянно нужен хостинг. Нормальный хостинг, к сожалению, я не нашел, но нашел способ как запускать ботов в любой момент времени даже без компьютера рядом. ReplIt - площадка для размещения своего кода, редактирования его и разработки его вместе с кем-либо. Благодаря удобному мобильному приложению код можно редактировать и запускать когда угодно.
🔷 🔎 Services - Libraries 📚 | 🔎 Сервисы - Библиотеки 📚
Note
🇷🇺 Сервисы помогут в создании проекта.
🔷 About developers 💫 | О разработчиках 💫
🔷 License | Лицензия
Project Pizzeria "Pizza and Capybara" is distributed under the MIT license
Full Changelog: PizzaAndKapibaraV2.1...PizzaAndKapibaraV3
Pizza And Kapibara site V2.1
🔷 Pizzeria "Pizza and Capybara" school project VERSION 2.1! | Пиццерия "Пицца и Капибара" школьный проект ВЕРСИЯ 2.1!
🔹 Hello everyone I am glad to congratulate everyone that the new version of my project has been released! So, what innovations have I introduced?
🔹 Всем привет! Я рад всех поздравить, что вышла новая версия моего проекта! Итак, какие же нововведения я внес?
🔷 List of changes in version 2.1 | Список изменений в версии 2.1
▶️ The method of adding content to the page has been changed.
❗ Inspired by the last update, I decided to make additional minor changes to the method of adding content to the page. As you can see, in the previous version of the site, I was forced to manually add new advertising cards to the page, but now I can just write information about the advertising banner in a JSON file. Also, if there are more than 6 banners, the arrows on the sides are activated, which I can scroll the banners to the right and to the left.
❗ Now, the content (Advertising Banners) it is loaded onto the page from JSON files. All you need to do is add a number of information to the JSON file in certain tags, which allows you to add banners of completely different types.
▶️ Изменен метод добавления контента на страницу.
❗ Вдохновившись прошлым обновлением, я решил внести дополнительные незначительные изменения в методе добавления контента на страницу. Как можно увидеть - в прошлой версии сайта, я был вынужден руками добавлять новые карточки рекламы на страницу, сейчас же я могу просто писать информацию о банере рекламы в файле JSON. Так же, если банеров более 6 шт, активизируются стрелки по бокам, которые могу скролить банеры на право и на лево.
❗ Теперь, контент (Банеры Рекламы) сам подгружается на страницу из файлов JSON. Все что нужно сделать это добавить в файл JSON ряд информации в определенные теги, что позволяет добавлять банеры совершенно разных типов.
‼️ От части, в результате этого изменения я уменьшил размер кода HTML.
🔷 🔎 Services - Libraries 📚 | 🔎 Сервисы - Библиотеки 📚
Note
🇷🇺 Сервисы помогут в создании проекта.
🔷 About developers 💫 | О разработчиках 💫
🔷 License | Лицензия
Project Pizzeria "Pizza and Capybara" is distributed under the MIT license
Full Changelog: PizzaAndKapibaraV2...PizzaAndKapibaraV2.1
Pizza And Kapibara site V2.0
🔷 Pizzeria "Pizza and Capybara" school project VERSION 2.0! | Пиццерия "Пицца и Капибара" школьный проект ВЕРСИЯ 2.0!
🔹 Hello everyone I am glad to congratulate everyone that the second version of my project has been released! So, what innovations have I introduced?
🔹 Всем привет! Я рад всех поздравить, что вышла вторая версия моего проекта! Итак, какие же нововведения я внес?
🔷 List of changes in version 2.0 | Список изменений в версии 2.0
▶️ The method of adding content to the page has been changed.
❗ After analyzing my further plans for this project, I decided to modernize my website. As you can see, in the previous version of the site, I was forced to manually add new product cards to the page, as well as separately write code in JS files to track the pressing of certain buttons.
❗ Now, the content (Product Cards) it is loaded onto the page from JSON files. All you need to do is add a number of information to the JSON file in certain tags, you can also create a new product category, which allows you to add products of completely different types. The JS code has been redesigned, which is now universal for all buttons.
‼️ As a result of this change, I solved the issue of excessive length of my html and js code by reducing the total number of lines in all files from 1800 to 1400 lines!
▶️ Изменен метод добавления контента на страницу.
❗ Проанализировав дальнейшие свои планы на этот проект я решил модернизировать свой сайт. Как можно увидеть - в прошлой версии сайта, я был вынужден руками добавлять новые карточки товара на страницу, а так же отдельно писать код в файлах JS для отслеживания нажатия определенных кнопок.
❗ Теперь, контент (Карточки товара) сам подгружается на страницу из файлов JSON. Все что нужно сделать это добавить в файл JSON ряд информации в определенные теги, так же можно создать новую категорию товара, что позволяет добавлять товары совершенно разных типов. Переработан код JS, который теперь является универсальным для всех кнопок.
‼️ В результате этого изменения я решил вопрос об излишней длине своего html и js кода, уменьшив суммарное количество строк во всех файлах с 1800 до 1400 строк!
🔷 🔎 Services - Libraries 📚 | 🔎 Сервисы - Библиотеки 📚
Note
🇷🇺 Сервисы помогут в создании проекта.
🔷 About developers 💫 | О разработчиках 💫
🔷 License | Лицензия
Project Pizzeria "Pizza and Capybara" is distributed under the MIT license
Full Changelog: PizzaAndKapibara...PizzaAndKapibaraV2
Pizza And Kapibara site V1.0
🔷 Pizzeria "Pizza and Capybara" school project | Пиццерия "Пицца и Капибара" школьный проект
🔹 Hello everyone! You now have an almost ready-made project in front of you, the development of which took a lot of effort and time. This is my first big project in the field of IT website creation. Now I will try to briefly describe the essence of the project, its purpose and how it works. The goal of the project is to create an online marketplace for ordering any product on the site and transfer the order data to a convenient environment for order analysis.Using HTML5 and CSS, I made the layout of the site.
🇷🇺 Всем привет! Перед вами сейчас расположен почти готовый проект, на разработку которого ушло не мало сил и времени. Это мой первый большой проект в сфере IT создания веб-сайтов. Сейчас я постараюсь кратко описать суть проекта его цель и то как он работает. Цель проекта - создать онлайн маркетплейс для заказа какого-либо товара на сайте и передать данные заказа в удобную среду для анализа заказа.Используя HTML5 и CSS сделал макет сайта.
🔹 The question arose about how to make a basket of goods and the first thing that came to mind was to create a server for downloading goods, but then I would have to study JS frameworks, and there was not much time for this, especially since I did not plan to make more products on the site, this method would only complicate the creation process. After studying JS, I learned about localStorage, which formed the basis for creating a bucket (Then I will return to the discussion of this method). I decided to choose telegram as the medium for processing information, since it is a popular social network in which you can conveniently create a bot. There were also convenient options that also took place in the project: sending an order by e-mail, sending an exel table.
🇷🇺 Встал вопрос о том как сделать корзину товаров и первое что полезло на ум - создание сервера для загрузки товаров, но тогда пришлось бы изучать фреймворки JS, а на это времени особо не было, тем более что я не планировал делать больше количество товаров на сайте, этот способ только усложнял бы процесс создания. После изучения JS я узнал о localStorage, который и лег в основе создания корзины (Далее я еще вернуть к обсуждению данного способа). В качестве среды для обработки информации я решил выбрать телеграм, так как это популярная соц-сеть в которой можно удобно создать бота. Были еще удобные варианты, которые тоже имели место быть в проекте: отправка заказа на e-mail, отправка таблицы exel. 📧
🔹 Local storage provides storage for data on an ongoing basis. Data from local storage is not automatically deleted and has no expiration date. This storage was perfect for my requirements, and there were enough videos on how to create a shopping cart on the site using localStorage. After learning the basics of JS, I started searching on YouTube for information on how to create a shopping cart. Unfortunately, most of the videos seemed too sophisticated and incomprehensible to me, I was looking for an easier way to create a shopping cart, but not all videos were useless. I found two videos that helped me create the SIMPLEST SHOPPING CART (The videos are attached below).
🇷🇺 Local storage представляет хранилище для данных на постоянной основе. Данные из local storage автоматически не удаляются и не имеют срока действия. Это хранилище идеально подходило под мои требовая, да и было достаточное количество видео о том, как создать корзину на сайте при помощи LocalStorage. Изучив основу JS я начал искать на ютубе информаию о том, как создать корзину. К сожалению, большинство видео для меня показались слишком замудренными и непонятными, я искал более простой способ для создания корзины, однако не все видео ролики были бесполезными. Я нашел два видео которые помогли мне создать САМУЮ ПРОСТУЮ КОРЗИНУ (Видео прикрепленны ниже).
🔹 This technology is based on a JSON file that initially stores a list of products. With it, you can not write code for each card, but use a script to make sure that the goods themselves are added! In my project, I did not use this idea because this method is effective when there are 10 types of goods. Next, the script tracks the click on each button on the site and records the click on the individual counter n. In the code you can find a lot of functions, comments to which I tried to write well and I think you can figure out what each of them does. Briefly: When you click on the button, an element from the "products" key (All products) is transferred to the "cart" key. Then, using the function, everything in the "cart" is transferred to a specific column in the table. The final sum is displayed at the bottom of the table, which is calculated by the function. After clicking on the "Send order" button, using the "Axios" module (Link below), an overgrowth is sent to the bot in the telegram, which displays the text in the group chat message.
🇷🇺 В основе этой технологии - файл JSON в котором изначально хранится список товаров. С помощью него можно не писать код для каждой карточки, а при помощи скрипта сделать так чтобы товары сами добавлялись! В своем проекте я не использовал эту идею так как этот метод эффективен когда товаров от 10 видов. Далее скрипт отслеживает нажатие на каждую кнопку на сайте и записывает нажатие на инживидуальный счетчик n. В коде вы можете найти множество функций, комметарии к которым я постарался хорошо написать и думаю вы сможете раобраться что делает каждая из них. Кратко: При нажатии на кнопку в ключ "cart" переносится элемент из ключа "products" (Все товары). Потом при помощи функции все что находится в "cart" переноситься в определенный столбец таблицы. Снизу таблицы выведена конечная сумма, которая подсчитывается функцией. После нажатия на кнопку "Отправить заказ" при помощи модуля "Axios" (Ссылка снизу) посылается зарос на бота в телеграмме который выводит текст в сообщении чата группы.
🔷 📑 Documentation - Video 🎥 | 📑 Документация - Видео 🎥
Tip
🇷🇺 Видео частично помогут решить основные задачи.
- RU: 🎥 Курс HTML + CSS, который я прошел перед созданием макета сайта
- RU: 🎥 Корзина JS на чистом DOM
- US: 🎥 Local storage shopping cart. | Insert, update, remove products from the browser's local storage.
-
Видео крайне полезно! Оно предоставляет почти готовое решения которое я подкрутил.
- RU: 🎥 Отправляем html форму с сайта на telegram + с документом на JavaScript
-
Мужик отлично рассказал о Axios и как им пользоваться.
🔷 🔎 Services - Libraries 📚 | 🔎 Сервисы - Библиотеки 📚
Note
🇷🇺 Сервисы помогут в создании проекта.
🔷 About developers 💫 | О разработчиках 💫
🔷 License | Лицензия
Project Pizzeria "Pizza and Capybara" is distributed under the MIT license