Разработка сайта интернет-магазина онлайн курсов
введение данных изменений становится крайне затруднительным.
Помимо этого, многие библиотеки NPM в Node.js характеризуются достаточно низким качеством, неполнотой, либо недостаточным количеством документации.
Node js сильно опирается на использование функций обратного вызова (callback functions), которые являются неотъемлемой частью асинхронного подхода к программированию, который используется в Node js. С ростом сложности приложения, количество callback функций также возрастает, что может привести к так называемому аду функций callback (callback hell). В данном случае дальнейшая разработка и поддержание приложения значительно усложняется [11].
- Express (Express.js)
Минимальная и гибкая платформа веб-приложений, построенная на основе Node.js и обеспечивающая расширенный набор функций для серверных частей приложений. Express.js позволяет быстро разрабатывать API за счет реализации различных служебных методов HTTP и промежуточного программного обеспечения [12].
СОДЕРЖАНИЕ
Термины, обозначения, сокращения 3
ВВЕДЕНИЕ 4
1. Постановка задач 5
2. Варианты создания сайта 10
2.1 Использование готовых сервисов для создания сайтов 10
2.1.1 www.tilda.cc 10
2.1.2 www.squarespace.com 11
2.2 Создание сайта самостоятельно с помощью фреймворков 13
2.3 Вывод по второй главе 17
3. Разработка сайта с применением React и Django 20
3.1 React (JavaScript) 20
3.1.1 JSX 20
3.1.2 useState 22
3.1.3 useEffect 24
3.1.4 Создание фронтенда сайта с онлайн курсами с помощью React 25
3.2 Django (Python) 31
3.2.1 Структура Django проекта 31
3.2.2 Django Rest Framework 32
3.2.3 Создание бэкенда сайта с онлайн курсами с помощью Django 38
4. Демонстрация разработанного сайта 49
ЗАКЛЮЧЕНИЕ 55
СПИСОК ИСПОЛЬЗОВАННЫХ ИСТОЧНИКОВ 56
СПИСОК ИСПОЛЬЗОВАННЫХ ИСТОЧНИКОВ1) coursera.org – URL: https://www.coursera.org/ (дата обращения 10.03.2023)
2) edx.org – URL: https://www.edx.org/ (дата обращения 10.03.2023)
3) khanacademy.org – URL: https://www.khanacademy.org/ (дата обращения 10.03.2023)
4) stepik.org – URL: https://stepik.org/learn (дата обращения 10.03.2023)
5) Открытое образование – URL: https://openedu.ru/ (дата обращения 10.03.2023)
6) Tilda Help Center – Code Export – URL: https://help.tilda.cc/export (дата обращения 10.03.2023)
7) Squarespace Help Center – URL: https://support.squarespace.com/hc/en-us/articles/206566687-Exporting-your-site (дата обращения 10.03.2023)
8) Фреймворк Vue.js – URL: https://ru.vuejs.org/v2/guide/index.html (дата обращения 10.03.2023)
9) Metanit.com – Введение в Angular – URL: https://metanit.com/web/angular2/1.1.php (дата обращения 10.03.2023)
10) DDI development - Pros and Cons of Vue.js Framework Programming – URL: https://ddi-dev.com/blog/programming/the-good-and-the-bad-of-vue-js-framework-programming/ (дата обращения 10.03.2023)
11) SMARSH InfoTech - Advantages and Disadvantages of Node.js: why to choose Node.js for web app development in 2023? – URL: https://www.smarshinfotech.com/blog/advantages-and-disadvantages-of-node-js/ (дата обращения 10.03.2023)
12) developer.mozilla.org – Веб-фреймворк Express (Node.js/JavaScript) – URL: https://developer.mozilla.org/ru/docs/Learn/Server-side/Express_Nodejs (дата обращения 10.03.2023)
13) LogRocket – Comparing top Node.js frameworks for frontend developers – URL: https://blog.logrocket.com/comparing-top-node-js-frameworks-frontend-developers/#rest-api-frameworks (дата обращения 10.03.2023)
14) Библиотека Chakra UI – URL: https://chakra-ui.com/docs/components (дата обращения 10.03.2023)
15) Библиотека React Router – URL: https://reactrouter.com/en/main (дата обращения 10.03.2023)
3.1 React (JavaScript)3.1.1 JSXJSX (JavaScript Syntax Extension, которое также называют JavaScript XML) — это расширение синтаксиса языка JavaScript, которое позволяет структурировать отрисовку компонентов с использованием синтаксиса, знакомого многим разработчикам. По внешнему виду и структуре JSX схож с HTML.
Компоненты React, то есть отдельные элементы пользовательского интерфейса, которые могут быть многократно переиспользованы, как правило создаются именно с применением JSX.
JSX элементы обладают рядом атрибутов, которые соответствуют атрибутам стандартного HTML, но также имеется возможность создавать пользовательские атрибуты, которые могут влиять на поведение, контент и отрисовку React компонента.