Використання React та Redux під час розробки вебзастосунків: проблеми та перспективи

Автор(и)

  • Ольга Ткаченко Державний університет інфраструктури та технологій (Національний транспортний університет), Україна https://orcid.org/0000-0003-1800-618X
  • Денис Мосюра Державний університет інфраструктури та технологій (Національний транспортний університет), Україна https://orcid.org/0009-0002-3145-2416

DOI:

https://doi.org/10.31866/2617-796X.8.1.2025.335535

Ключові слова:

веброзробка, фреймворк, React, Redux, frontend-розробка, бібліотеки JavaScript

Анотація

Розробка вебзастосунків від простих вебсторінок до складних інтерактивних платформ, таких як соціальні мережі, системи е-commerce, корпоративні портали, потребує використання нових підходів, інструментів і технологій. Особливу роль у розробці вебзастосунків відіграють JavaScript-бібліотеки та фреймворки, які спрощують створення ефективних, масштабованих і зручних інтерфейсів.

Метою статті є дослідження проблем та перспектив використання React у поєднанні з Redux під час створення вебзастосунків складної структури, оцінка переваг їх сумісного використання порівняно з аналогічними інструментами та розробка вебзастосунку «FarmerProducts».

Методами дослідження є основні методологічні підходи та технологічні засоби для розробки вебзастосунків. Такими методами, зокрема, є системний і порівняльний аналізи – для виявлення особливостей створення вебзастосунків; метод експертних оцінок, який передбачає аналіз літературних джерел та інформаційних ресурсів, проведення інтерв’ю та опитування експертів, а також процеси розробки й тестування масштабованих і високопродуктивних вебзастосунків на основі використання REACT та REDUX.

Новизною дослідження є аналіз сучасного інструментарію (React, Angular, Vue.js) з розробки вебзастосунків, визначення проблем та перспектив їх застосування, створення авторського вебзастосунку (за допомогою React та Redux), який охоплює інтуїтивно зрозумілий інтерфейс, гнучку базу даних, спрощуючи процес роботи із застосунком завдяки використанню стеку сучасних технологій.

Висновки. У роботі проаналізовано проблеми та перспективи використання сучаного інструментарію розробки вебзастосунків; приділено основну увагу React, який підходить для різних проєктів; проведено порівняльний аналіз React з Angular, Vue.js та Svelte, визначено їхні основні характеристики, переваги, недоліки; продемонстровано залежність вибору інструментарію від контексту проєкту (React у поєднанні з Redux може забезпечити оптимальний баланс між продуктивністю, гнучкістю та масштабованістю); описано авторський вебзастосунок – інтернет-магазин «FarmerProducts»; визначено подальші шляхи вдосконалення цього вебзастосунку.

Біографії авторів

Ольга Ткаченко, Державний університет інфраструктури та технологій (Національний транспортний університет)

Кандидат фізико-математичних наук, доцент, доцент кафедри інформаційних технологій

Денис Мосюра, Державний університет інфраструктури та технологій (Національний транспортний університет)

Бакалавр, кафедра інформаційних технологій

Посилання

Angular (web framework), n.d. Wikipedia. [online] Avialable at: <https://en.wikipedia.org/wiki/Angular_(web_framework)> [Accessed 01 March 2025].

Armstrong, L., 2020. Using Vue in jQuery and JavaScript Sites. DEV, [ online] 1 March. Avialable at: <https://dev.to/workingwebsites/using-vue-in-jquery-and-javascript-sites-1ib7> [Accessed 01 March 2025].

Dave Ceddia, 2019. Introduction to Svelte. [online] 24 July. Avialable at: <https://daveceddia.com/svelte-intro/> [Accessed 01 March 2025].

Developer Survey, n.d. [online] Avialable at: <https://survey.stackoverflow.co/2023/#section-admired-and-desired-web-frameworks-and-technologies> [Accessed 01 March 2025].

Di Gese, I., 2019. jQuery isn’t useful anymore. Here’s why. Do we still need jQuery to DOM-script web pages?. Medium, [online] 29 September. Avialable at: <https://javascript.plainenglish.io/jquery-will-die-soon-heres-why-976a6b8105e1> [Accessed 01 March 2025].

Doglio, F., n.d. Top 7 Frontend Frameworks to Use in 2025: Pro Advice. Roadmap.sh. [online] Avialable at: <https://roadmap.sh/frontend/frameworks> [Accessed 01 March 2025].

facebook/react, n.d. GitHub. [online] Avialable at: <https://github.com/facebook/react> [Accessed 01 March 2025].

Gorilla Logic, 2020. How to Achieve Aspect-Oriented Programming (AOP) in Angular 2+ Gorilla Logic, [blog] 6 February. Avialable at: <https://gorillalogic.com/blog-and-resources/how-to-achieve-aspect-oriented-programming-aop-in-angular-2> [Accessed 01 March 2025].

Guest, 2021. What is React JS? Simpat Tech, [online] 23 August. Avialable at: <https://simpat.tech/what-is-react/> [Accessed 01 March 2025].

Hernandez, I., 2024. Svelte vs. React: The Ultimate JavaScript Framework Showdown. Dreamhost, [online] 14 August. Avialable at: <https://www.dreamhost.com/blog/svelte-vs-react/> [Accessed 01 March 2025].

Patel, K., 2020. Vue JS FAQs. Francium Tech, [blog] 11 April. Avialable at: <https://blog.francium.tech/vue-js-faqs-ddf744dd4093> [Accessed 01 March 2025].

Prasandeep, 2024. How To Integrate Redux with React Based Application: A Step By Step Tutorial. Semaphore, [online] 31 January. Avialable at: <https://semaphore.io/blog/redux-react> [Accessed 01 March 2025].

React Community, n.d. [online] Avialable at: <https://react.dev/community> [Accessed 01 March 2025].

React Router Official Documentation, n.d. [online] Avialable at: <https://reactrouter.com/> [Accessed 01 March 2025].

Ready to use Material Design components, n.d. [online] Avialable at: <https://mui.com/material-ui/?srsltid=AfmBOora8qN_ab1KonqyHwKXn3saxNOXMCfK_9sjV7Ng-qGC8FmCKxUc> [Accessed 01 March 2025].

Virtual DOM and Internals, n.d. React. [online] Avialable at: <https://uk.legacy.reactjs.org/docs/faq-internals.html> [Accessed 01 March 2025].

Ways of Using Vue, n.d. Vue.js. [online] Avialable at: <https://vuejs.org/guide/extras/ways-of-using-vue> [Accessed 01 March 2025].

What is dirty checking in AngularJs and how does it work?, n.d. Quora. [online] Avialable at: <https://www.quora.com/What-is-dirty-checking-in-AngularJs-and-how-does-it-work> [Accessed 01 March 2025].

##submission.downloads##

Опубліковано

2025-07-18

Як цитувати

Ткаченко, О., & Мосюра, Д. (2025). Використання React та Redux під час розробки вебзастосунків: проблеми та перспективи. Цифрова платформа: інформаційні технології в соціокультурній сфері, 8(1), 104–121. https://doi.org/10.31866/2617-796X.8.1.2025.335535

Номер

Розділ

Інформаційні технології в освіті, мистецтві та культурі