Будь ласка, використовуйте цей ідентифікатор, щоб цитувати або посилатися на цей матеріал: http://elartu.tntu.edu.ua/handle/lib/49617
Повний запис метаданих
Поле DCЗначенняМова
dc.contributor.advisorДмитроца, Леся Павлівна-
dc.contributor.authorТарас, Христина Іванівна-
dc.contributor.authorTaras, Khrystyna Ivanivna-
dc.date.accessioned2025-07-07T17:44:35Z-
dc.date.available2025-07-07T17:44:35Z-
dc.date.issued2025-06-28-
dc.date.submitted2025-06-28-
dc.identifier.citationТарас Х. І. Розробка інтернет-магазину косметики Lorena засобами Next.js, Stripe, Tailwind CSS та MongoDB : робота на здобуття кваліфікаційного ступеня бакалавра : спец. 122 - комп’ютерні науки / наук. кер. Л. П. Дмитроца. Тернопіль : Тернопільський національний технічний університет імені Івана Пулюя, 2025. 82 с.uk_UA
dc.identifier.urihttp://elartu.tntu.edu.ua/handle/lib/49617-
dc.descriptionРоботу виконано на кафедрі комп'ютерних наук Тернопільського національного технічного університету імені Івана Пулюя. Захист відбудеться 28.06.2025р. на засіданні екзаменаційної комісії №30 у Тернопільському національному технічному університеті імені Івана Пулюяuk_UA
dc.description.abstractКваліфікаційна робота присвячена дослідженню процесу створення сучасного інтернет-магазину косметики з використанням технологій веброзробки. У першому розділі кваліфікаційної роботи описано актуальні тенденції розвитку електронної комерції в Україні та світі. Висвітлено ключові вимоги до функціоналу сучасних онлайн-магазинів. Розглянуто аналоги та конкурентні рішення. Проаналізовано вибір технологій, необхідних для реалізації проєкту. У другому розділі кваліфікаційної роботи описано архітектуру застосунку, структуру даних, обрані технології та бібліотеки. Досліджено особливості реалізації клієнтської та адміністративної частин. Подано опис функціоналу, що забезпечує повноцінну роботу магазину. У третьому розділі кваліфікаційної роботи описано процес розгортання вебзастосунку, тестування інтерфейсу та перевірку продуктивності. Проаналізовано результати, отримані за допомогою інструментів оптимізації. Проведено перевірку на відповідність сучасним вимогам користувацького досвіду. Об’єкт дослідження: процес розробки вебзастосунку для електронної комерції. Предмет дослідження: технології створення функціонального інтернет-магазину з використанням Next.js, Tailwind CSS, MongoDB, Stripe та Clerk.uk_UA
dc.description.abstractThe qualification work is devoted to the study of the process of creating a modern online cosmetics store using web development technologies. The first chapter of the qualification work describes the current trends in the development of e-commerce in Ukraine and the world. The key requirements for the functionality of modern online stores are highlighted. Analogues and competitive solutions are considered. The choice of technologies required for project implementation is analyzed. The second section of the qualification work describes the application architecture, data structure, selected technologies, and libraries. The features of the client and administrative parts are investigated. A description of the functionality that ensures the full operation of the store is provided. The third chapter of the qualification work describes the process of deploying the web application, testing the interface, and checking its performance. The results obtained with the help of optimization tools are analyzed. The results obtained with the help of optimization tools are analyzed. Object of research: the process of developing a web application for e-commerce. The subject of research: technologies for creating a functional online store using Next.js, Tailwind CSS, MongoDB, Stripe, and Clerkuk_UA
dc.description.tableofcontentsВСТУП 10 РОЗДІЛ 1. АНАЛІЗ ПРЕДМЕТНОЇ ОБЛАСТІ ТА ПОСТАНОВКА ЗАВДАННЯ НА РОЗРОБКУ ІНТЕРНЕТ-МАГАЗИНУ КОСМЕТИКИ LORENA 11 1.1 Аналіз ринку інтернет-магазинів косметики та їх функціональних вимог 11 1.1.1 Сучасні тенденції у сфері електронної комерції косметики 11 1.1.2 Функціональні вимоги до сучасних e-commerce рішень 12 1.1.3 Роль адміністративної панелі в управлінні інтернет-магазином 14 1.2 Аналітичний огляд існуючих інтернет-магазинів косметики 15 1.3 Постановка завдання розробки інтернет-магазину косметики з адміністративною панеллю 18 1.3.1 Область застосування та призначення розробки інтернет-магазину Lorena 18 1.3.2 Вимоги до функціоналу сайту інтернет-магазину Lorena 19 1.3.3 Стадії та етапи розробки інтернет-магазину 20 1.4 Вибір та обґрунтування використаних технологій 22 1.4.1 Обґрунтування вибору фреймворку Next.js 22 1.4.2 Використання Tailwind CSS для UI 23 1.4.3 Вибір MongoDB в якості бази даних для інтернет-магазину 24 1.4.4 Інтеграція з платіжною системою Stripe 25 1.4.5 Обґрунтування використання Clerk для автентифікації 26 1.5 Висновок до першого розділу 27 РОЗДІЛ 2. ПРОЕКТУВАННЯ ТА РЕАЛІЗАЦІЯ ІНТЕРНЕТ-МАГАЗИНУ LORENA 29 2.1 Технологічні та архітектурні основи побудови вебзастосунку Lorena 29 2.1.1 Загальний опис архітектури інтернет-магазину 29 2.1.2 Структура файлової системи проекту 30 2.1.3 Бібліотеки, використані для розробки клієнтської частини проєкту 33 2.1.4 Бібліотеки, використані для розробки адміністративної частини проєкту 34 2.2 Моделювання бази даних 36 2.3 Реалізація функціональності клієнтської частини інтернет-магазину 38 2.3.1 Реєстрація користувачів та їх авторизація у системі 38 2.3.2 Структура головної сторінки та навігаційного меню 42 2.3.3 Додавання товарів у список бажань та перегляд сторінки продукту 44 2.3.4 Додавання товарів у кошик, оформлення та оплата замовлення 47 2.4 Огляд функціоналу адміністративної частини інтернет-магазину 50 2.4.1 Реєстрація користувачів та їх авторизація у системі 50 2.4.2 Інформаційна панель адміністратора 51 2.4.3 Управління колекціями та додавання нових товарів 52 2.4.4 Управління замовленнями та клієнтами 55 2.5 Огляд дизайну інтернет-магазину Lorena 57 2.5.1 Кольорова схема інтернет-магазину та логотипи 57 2.5.2 Розробка адаптивного дизайну за допомогою Tailwind CSS 59 2.6 Висновок до другого розділу 61 РОЗДІЛ 3. ПРАКТИЧНА РЕАЛІЗАЦІЯ ТА ТЕСТУВАННЯ ІНТЕРНЕТ-МАГАЗИНУ LORENA 62 3.1 Розгортання інтернет-магазину в Інтернеті 62 3.2 Валідація й тестування функціональності інтернет-магазину 63 3.2.1 Валідація розмітки інтерфейсу та форм 63 3.2.2 Перевірка інтернет-магазину на кросбраузерність і тестування його швидкості 64 3.3 Підтримка та подальший розвиток інтернет-магазину Lorena 66 3.4 Висновок до третього розділу 66 РОЗДІЛ 4. БЕЗПЕКА ЖИТТЄДІЯЛЬНОСТІ, ОСНОВИ ОХОРОНИ ПРАЦІ 68 4.1 Психологічні чинники небезпеки 68 4.2 Загальні вимоги безпеки з охорони праці для користувачів ПК 70 4.3 Висновок до четвертого розділу 72 ВИСНОВКИ 73 ПЕРЕЛІК ДЖЕРЕЛ 75 ДОДАТКИuk_UA
dc.format.extent82-
dc.language.isoukuk_UA
dc.publisherТНТУ ім. І.Пулюя, ФІС, м. Тернопіль, Українаuk_UA
dc.subject122uk_UA
dc.subjectвеброзробкаuk_UA
dc.subjectелектронна комерціяuk_UA
dc.subjectінтернет-магазинuk_UA
dc.subjectclerkuk_UA
dc.subjecte-commerceuk_UA
dc.subjectmongoDBuk_UA
dc.subjectnext.jsuk_UA
dc.subjectonline storeuk_UA
dc.subjectstripeuk_UA
dc.subjecttailwind cssuk_UA
dc.subjectweb developmentuk_UA
dc.titleРозробка інтернет-магазину косметики Lorena засобами Next.js, Stripe, Tailwind CSS та MongoDBuk_UA
dc.title.alternativeDevelopment of the Lorena Cosmetics Online Store Using Next.js, Stripe, Tailwind CSS, and MongoDBuk_UA
dc.typeBachelor Thesisuk_UA
dc.rights.holder© Тарас Христина Іванівна, 2025uk_UA
dc.coverage.placenameТернопільuk_UA
dc.subject.udc004.4uk_UA
dc.relation.references1. Online Cosmetics Market Size & Share Analysis - Growth Trends & Forecasts (2025 - 2030). Mordor Intelligence. [Електронний ресурс]. Режим доступу до ресурсу: https://www.mordorintelligence.com/industry-reports/online-cosmetics-market?.uk_UA
dc.relation.references2. The Beauty Category’s Dynamic Growth: A 2024 Mid-Year Update. NIQ. [Електронний ресурс]. 09.08.2024. Режим доступу до ресурсу: https://nielseniq.com/global/en/insights/commentary/2024/beauty-2024-mid-year-update/?uk_UA
dc.relation.references3. Струтинська, І. В., Дмитроца, Л. П., Сороківська, О. А., & Козбур, Г. В. (2024). Особливості цифрового розвитку малого і середнього бізнесу України, країн Європи та G7. In Трансформація бізнесу для сталого майбутнього: дослідження, цифровізація та інновації: монографія (pp. 411-427). : ФОП Паляниця В. А.uk_UA
dc.relation.references4. Beauty E-commerce Trends 2024: A Comprehensive Guide for Founders and Marketing Leaders. Peel. [Електронний ресурс]. 24.02.2025. Режим доступу до ресурсу: https://www.peelinsights.com/post/beauty-e-commerce-trends-2024-a-comprehensive-guide-for-founders-and-marketing-leaders?.uk_UA
dc.relation.references5. Струтинська, І. В., Дмитроца, Л. П., Козбур, Г. В., & Дмитрук, У. І. (2020). Ключові фактори, що сприяють розвитку цифрової економіки. Тези доповідей міжнародної науково-практичної конференції „Цифрова економіка як фактор інноваційного розвитку суспільства “, 43-45.uk_UA
dc.relation.references6. Струтинська, І. В., & Мельник, В. О. (2022). Роль автоматизованих систем керування замовленнями. Матеріали ⅩⅠ Міжнародної науково-практичної конференції молодих учених та студентів „Актуальні задачі сучасних технологій “, 133-134.uk_UA
dc.relation.references7. Moskvichova A. 30 Major Requirements for Ecommerce Websites: Checklist to Start a Store. Digitalsuits. [Електронний ресурс]. 20.08.2024. Режим доступу до ресурсу: https://digitalsuits.co/blog/10-major-requirements-for-e-commerce-website/?.uk_UA
dc.relation.references8. Shah P. E-Commerce System Requirements: A Comprehensive Guide. DhiWise. [Електронний ресурс]. 25.03.2025. Режим доступу до ресурсу: https://www.dhiwise.com/blog/requirement-builder/ecommerce-system-requirements.uk_UA
dc.relation.references9. Marzal R. Key Metrics to Track on Your Ecommerce Dashboard. NextScenario. [Електронний ресурс]. Режим доступу до ресурсу: https://nextscenario.com/ecommerce-dashboard/.uk_UA
dc.relation.references10. Shvetsova Y. Functional and Non-Functional Requirements of Online Shopping System: List & Examples. Elogic. [Електронний ресурс]. 08.06.2023. Режим доступу до ресурсу: https://elogic.co/blog/functional-and-non-functional-requirements-for-ecommerce-websites/?.uk_UA
dc.relation.references11. Pattamatta R. Ecommerce Admin Dashboard: Key Features, Benefits, and Best Practices. Databrain. [Електронний ресурс]. 08.05.2025. Режим доступу до ресурсу: https://www.usedatabrain.com/blog/ecommerce-admin-dashboard?.uk_UA
dc.relation.references12. Alferez A. Unveiling the Power of Admin Panels: A Comprehensive Guide. Ecommerce Next. [Електронний ресурс]. 26.08.2024. Режим доступу до ресурсу: https://www.ecommercenext.org/unveiling-the-power-of-admin-panels-a-comprehensive-guide/.uk_UA
dc.relation.references13. Kirvan P. What is a Waterfall model? Definition and guide. TechTarget. [Електронний ресурс]. 24.11.2024. Режим доступу до ресурсу: https://www.techtarget.com/searchsoftwarequality/definition/waterfall-model.uk_UA
dc.relation.references14. Jaja D. Routing in Next.js – How to Use App Router in your Next Apps. FreeCodeCamp. [Електронний ресурс]. 24.08.2023. Режим доступу до ресурсу: https://www.freecodecamp.org/news/routing-in-nextjs/.uk_UA
dc.relation.references15. Garg R. Next.js: The Ultimate Guide to SSR and SSG in React. Medium. [Електронний ресурс]. 07.07.2023. Режим доступу до ресурсу: https://medium.com/womenintechnology/next-js-the-ultimate-guide-to-ssr-and-ssg-in-react-245598d765c3.uk_UA
dc.relation.references16. Прус О. Next.js чи Angular: який фреймворк обрати замовнику для розробки?. Wezom. [Електронний ресурс]. 11.11.2024. Режим доступу до ресурсу: https://wezom.com.ua/ua/blog/author/aleksandr-prus.uk_UA
dc.relation.references17. Wili Rahmat M. How to deploy Next.js to Vercel with CI/CD Integration. Medium. [Електронний ресурс]. 12.05.2023. URL: https://medium.com/@wilirahmatm/how-to-deploy-next-js-to-vercel-with-ci-cd-integration-c2645cb77ff0.uk_UA
dc.relation.references18. Готович, В. А., & Мачужак, А. В. (2022). Застосування методології CI/CD для автоматизації процесів тестування та розгортання програмного забезпечення. Матеріали ⅩⅠ Міжнародної науково-практичної конференції молодих учених та студентів „Актуальні задачі сучасних технологій “, 131-132.uk_UA
dc.relation.references19. Sytnyk D. Використання CORS в Next.js для обробки cross-origin запитів. Medium. [Електронний ресурс]. 09.07.2023. Режим доступу до ресурсу: https://medium.com/@dmitry.sytnyk/%D0%B2%D0%B8%D0%BA%D0%BE%D1%80%D0%B8%D1%81%D1%82%D0%B0%D0%BD%D0%BD%D1%8F-cors-%D0%B2-next-js-%D0%B4%D0%BB%D1%8F-%D0%BE%D0%B1%D1%80%D0%BE%D0%B1%D0%BA%D0%B8-cross-origin-%D0%B7%D0%B0%D0%BF%D0%B8%D1%82%D1%96%D0%B2-d8fe2f8eae8a.uk_UA
dc.relation.references20. Hernandez I. Tailwind Vs. Bootstrap: Який CSS фреймворк вам потрібен?. DreamHost. [Електронний ресурс]. 29.05.2024. Режим доступу до ресурсу: https://www.dreamhost.com/blog/uk/tailwind-proti-bootstrap/.uk_UA
dc.relation.references21. Introduction to Tailwind CSS. GeeksForGeeks. [Електронний ресурс]. 07.10.2024. Режим доступу до ресурсу: https://www.geeksforgeeks.org/introduction-to-tailwind-css/.uk_UA
dc.relation.references22. Тарас Х. Дизайнерські компетенції програміста у контексті використання Tailwind CSS. VIII Міжнародна студентська науково-технічна конференція «Природничі та гуманітарні науки. Актуальні питання»., Тернопіль. Тернопільський національний технічний університет ім. І.Пулюя (м.Тернопіль, 24–25 квіт. 2025 р.), 2025. С. 204–206.uk_UA
dc.relation.references23. Bhaskar V. Tailwind CSS Best Practices for Performance Optimization. TailGrids. [Електронний ресурс]. 09.04.2025. Режим доступу до ресурсу: https://tailgrids.com/blog/tailwind-css-best-practices-and-performance-optimization.uk_UA
dc.relation.references24. Singh N. Understanding the Variances Between JSON and BSON in MongoDB. Medium. [Електронний ресурс]. 29.12.2023. Режим доступу до ресурсу: https://medium.com/@navneetskahlon/understanding-the-variances-between-json-and-bson-in-mongodb-258b39c169f7.uk_UA
dc.relation.references25. Kristbergsson E. S. The MongoDB and Next.js Stack for Beginners. Medium. [Електронний ресурс]. 09.01.2024. Режим доступу до ресурсу: https://medium.com/stackademic/the-mongodb-and-next-js-stack-for-beginners-b4394872f5bb.uk_UA
dc.relation.references26. Prisma ORM MongoDB database connector. Prisma /docs. [Електронний ресурс]. Режим доступу до ресурсу: https://www.prisma.io/docs/orm/overview/databases/mongodb.uk_UA
dc.relation.references27. Ramanayake B. What you need to know about MongoDB Atlas ?. Medium. [Електронний ресурс]. 08.07.2023. Режим доступу до ресурсу: https://medium.com/@bdhanushka65/what-you-need-to-know-about-mongodb-atlas-b4743727e7f1.uk_UA
dc.relation.references28. Stripe: найдорожча фінтех-компанія у Кремнієвій долині. Blog.imena.ua. [Електронний ресурс]. 05.06.2024. Режим доступу до ресурсу: https://www.imena.ua/blog/stripe/.uk_UA
dc.relation.references29. Security at Stripe. Stripe Docs. [Електронний ресурс]. Режим доступу до ресурсу: https://docs.stripe.com/security.uk_UA
dc.relation.references30. Nyabuto, M. G. M., Mony, V., & Mbugua, S. (2024). Architectural review of client-server models. International journal of scientific research and engineering trends, 10(1), 139-143.uk_UA
dc.relation.references31. Ansari K. Next.js App Router: Routing. Medium. [Електронний ресурс]. 19.04.2024. Режим доступу до ресурсу: https://medium.com/@kulsumansari4/next-js-app-router-routing-8d795dbe324c.uk_UA
dc.relation.references32. Salnik R. Опановуємо CRUD в Next.js. Поради для інтеграції та оптимізації. DOU.UA. [Електронний ресурс]. 17.12.2024. Режим доступу до ресурсу: https://dou.ua/forums/topic/51587/.uk_UA
dc.relation.references33. Колесніков Д. Що таке фреймворк: пояснюємо простими словами. Brainlab. [Електронний ресурс]. 02.03.2023. Режим доступу до ресурсу: https://brainlab.com.ua/uk/blog-uk/shho-take-frejmvork-poyasnyuyemo-prostymy-slovamy.uk_UA
dc.relation.references34. Колесніков Д. Що таке фреймворк: пояснюємо простими словами. Brainlab. [Електронний ресурс]. 02.03.2023. Режим доступу до ресурсу: https://brainlab.com.ua/uk/blog-uk/shho-take-frejmvork-poyasnyuyemo-prostymy-slovamy.uk_UA
dc.relation.references35. Rashkovits, R., & Lavy, I. (2021). Mapping common errors in entity relationship diagram design of novice designers. International Journal of Database Management Systems, 13(1), 1-19.uk_UA
dc.relation.references36. Shwetha, H., Prajwal, D., & Sridharan, S. (2024, April). From MongoDB to React: Unleashing the Power of MERN in E-commerce. In 2024 International Conference on Emerging Technologies in Computer Science for Interdisciplinary Applications (ICETCS) (pp. 1-6). IEEE.uk_UA
dc.relation.references37. <UserButton /> component. Clerk Docs. [Електронний ресурс]. Режим доступу до ресурсу: https://clerk.com/docs/components/user/user-button.uk_UA
dc.relation.references38. Nousiainen, A. (2024). The potential of WebAssembly in Edge Computing.uk_UA
dc.relation.references39. Gulshan N. Streamlining Your Code: Top Online HTML Validators for Web Developers. Medium. [Електронний ресурс]. 18.09.2023. Режим доступу до ресурсу: https://medium.com/@gulshan_n/streamlining-your-code-top-online-html-validators-for-web-developers-49182f1e2d5c.uk_UA
dc.relation.references40. Дмитроца, Л. П., & Старицький, О. Т. (2024). Оптимізація продуктивності та SEO при масштабуванні проєктів на основі React і Next. js. Збірник тез доповідей ⅩⅢ Міжнародної науково-практичної конференції молодих учених та студентів „Актуальні задачі сучасних технологій “, 465-466.uk_UA
dc.relation.references41. Безпека життєдіяльності: підручник / за ред. В. Г. Беспалька. – К.: Центр учбової літератури, 2012. – 384 с.uk_UA
dc.relation.references42. Золотарьова І. М. Психологія безпеки: навч. посіб. – Харків: НУЦЗУ, 2018. – 164 с.uk_UA
dc.relation.references43. Козяр М. М. Психологічні основи формування безпечної поведінки людини / М. М. Козяр // Вісник ЛНУ ім. Івана Франка. Серія: Психологія. – 2019. – № 6. – С. 112–118.uk_UA
dc.relation.references44. Яковлєв Є. О. Людський фактор в системі безпеки праці / Є. О. Яковлєв // Науковий вісник УкрДУЗТ. – 2020. – № 192. – С. 85–91.uk_UA
dc.relation.references45. Стельмах Л. В. Психологічні аспекти небезпеки в професійній діяльності / Л. В. Стельмах // Безпека життєдіяльності. – 2017. – № 2. – С. 21–25.uk_UA
dc.relation.references46. Гелетій М. М. Основи охорони праці: підручник / М. М. Гелетій, М. П. Лапчук, І. М. Гнатюк. – Львів: Новий Світ – 2000, 2020. – 352 с.uk_UA
dc.relation.references47. ДСТУ 8604:2015. Дизайн і ергономіка. Робоче місце для виконання робіт у положенні сидячи. Загальні ергономічні вимоги. – [Чинний від 01.07.2017]. – К.: ДП «УкрНДНЦ», 2017. – 10 с.uk_UA
dc.relation.references48. ДСТУ EN ISO 9241-5:2018. Ергономіка взаємодії людини і системи. Частина 5. Вимоги до робочих місць із дисплеями інформації. – К. : ДП «УкрНДНЦ», 2018. – 28 с.uk_UA
dc.relation.references49. ДСТУ 4196:2003. Освітлення робочих місць. Норми та методи вимірювань. – К. : ДП «УкрНДНЦ», 2003. – 22 с.uk_UA
dc.relation.references50. НПАОП 0.00-4.10-18. Організація робочих місць: загальні положення. – К., 2018. – 40 с.uk_UA
dc.relation.references51. Литвиненко О. М. Ергономіка та охорона праці при роботі з ПК / О. М. Литвиненко. – Харків: ХНАМГ, 2020. – 180 с.uk_UA
dc.relation.references52. Правила улаштування електроустановок (ПУЕ). – Харків: Видавництво ,,Форт,,, 2017. 760 с.uk_UA
dc.contributor.affiliationТНТУ ім. І. Пулюя, Факультет комп’ютерно-інформаційних систем і програмної інженерії, Кафедра комп’ютерних наук, м. Тернопіль, Українаuk_UA
dc.coverage.countryUAuk_UA
Розташовується у зібраннях:122 — Компʼютерні науки (бакалаври)

Файли цього матеріалу:
Файл Опис РозмірФормат 
2025_KRB_SN-43_Taras_KI.pdfДипломна робота3,47 MBAdobe PDFПереглянути/відкрити


Усі матеріали в архіві електронних ресурсів захищені авторським правом, всі права збережені.

Інструменти адміністратора