udemy
Udemy - одна из самых больших площадок в мире по доставке обучающего контента от разных авторов всего мира. Присутсвуют курсы практически на любую тему.
MERN Стек React, Socket io, Next.js Express, MongoDb, Nodejs
MERN Stack React, Socket io, Next.js Express,MongoDb, Nodejs
★4.6 (всего оценок - 16)
Продолжительность
13 ч 2 мин
Категория
MongoDBКоличество уроков
89 Видео
Дата добавления
26 сент. 2021 г., 22:11
Язык
Английский
Дата выхода
12 авг. 2021 г., 03:00
Дата обновления
29 апр. 2026 г., 12:56
Повысьте уровень своих навыков MERN-разработки и создайте мощное, масштабируемое приложение, максимально приближенное к реальному продукту.
Что представляет собой этот продвинутый курс MERN
Курс создан для разработчиков с базовым опытом работы с MERN, которые хотят выйти за рамки простых пет‑проектов и научиться строить полноценные социальные приложения с реальным временем, сложной логикой и современными технологиями — React, Next.js, Socket.io, Express, MongoDB, Node.js.
Основные цели и результаты обучения
После прохождения курса вы создадите многофункциональную социальную платформу, которая станет мощным проектом в портфолио. Вы научитесь внедрять ключевые возможности современных соцсетей — от реального времени до бесконечной прокрутки и персонализированных уведомлений.
Ключевые навыки, которые вы освоите
- Интеграция React и Next.js для создания интерфейсов с серверным рендерингом (SSR) и оптимизированной структурой страниц.
- Express и Node.js для настройки надёжного backend‑приложения.
- Socket.io для создания реального времени: чаты, онлайн‑пользователи, мгновенные уведомления.
- MongoDB и сложные модели данных для хранения постов, сообщений, подписчиков, уведомлений и другой связанной информации.
- Работа с реальным медиаконтентом: загрузка изображений, обработка и хранение в CLOUDINARY.
Что будет в итоговом приложении
Вы соберёте крупное социальное веб‑приложение, состоящее из множества взаимосвязанных модулей. Вот что вы реализуете:
Функциональность соцсети
- Реальный чат с несколькими пользователями и звуковыми уведомлениями.
- Система подписчиков и подписок, отображение онлайн‑пользователей.
- Мгновенные уведомления: лайки, комментарии, новые подписки.
- Посты с изображениями и предпросмотром.
- Бесконечная прокрутка с подгрузкой новых постов.
Управление пользователями и данными
- Создание и заполнение связанных моделей MongoDB.
- Редактирование профиля, аватаров и информации о пользователе.
- Настройки уведомлений и параметров аккаунта.
- Функция сброса пароля через NodeMailer и SendGrid.
- Поддержка администратора (root‑пользователь) с расширенными правами.
Техническая оптимизация
- Полностью адаптивный интерфейс без CSS media‑запросов — только на JavaScript.
- Оптимизация под SSR для ускорения загрузки и повышения SEO‑показателей.
- Использование Semantic‑UI для стилей и структурирования интерфейса.
Развёртывание и итог
В финале вы развернёте весь проект на Heroku и получите готовое к демонстрации приложения, которое покажет потенциальным работодателям ваши реальные навыки MERN‑разработчика.
Почему этот курс выделяется
Это не очередной учебный пример — вы создадите сложное, глубокое приложение на 13+ часов видеоматериалов, которое поможет вам уверенно перейти на новый профессиональный уровень.
Это пробный урок. Оформите подписку, чтобы получить доступ ко всем материалам курса. Премиум
- Урок 1. 00:00:47New update: realTime Notifications
- Урок 2. 00:01:39Crop Images Before Upload: New Update
- Урок 3. 00:00:47Requirements for taking this Course
- Урок 4. 00:02:32Introduction to Nextjs
- Урок 5. 00:01:35Connecting to MongoDB
- Урок 6. 00:05:07Creating Express Server
- Урок 7. 00:10:06App.js, Layout and Navbar
- Урок 8. 00:39:35Layout for Signup and Login Pages
- Урок 9. 00:07:30User, Profile and Follower Models
- Урок 10. 00:14:42Api Routes for Signup & Login
- Урок 11. 00:03:51Connecting to Cloudinary
- Урок 12. 00:15:14Wiring Signup and Login API to the frontend
- Урок 13. 00:07:45How getInitialProps works
- Урок 14. 00:14:13Authentication in NextJs
- Урок 15. 00:02:50_app.js Functional Component
- Урок 16. 00:05:49Creating HomePage Grid
- Урок 17. 00:10:11Creating SideMenu
- Урок 18. 00:11:45Search For Users
- Урок 19. 00:03:26Fixing a bug with Search
- Урок 20. 00:03:45Creating PostModel
- Урок 21. 00:14:00API routes to Create, Get and Delete Post
- Урок 22. 00:10:23API routes to Like and Unlike Post
- Урок 23. 00:11:12API routes to comment on a Post
- Урок 24. 00:30:38Rendering the Posts
- Урок 25. 00:13:23CreatePost Component
- Урок 26. 00:12:45Adding the Functionality to ADD & DELETE posts
- Урок 27. 00:04:20Functionality to LIKE & UNLIKE POST
- Урок 28. 00:06:50Functionality to POST & DELETE COMMENTS
- Урок 29. 00:09:02LikesList Component
- Урок 30. 00:09:54Add Modals for Posts
- Урок 31. 00:07:57Implement Infinite Scroll
- Урок 32. 00:01:38Quickly Fixing a small bug
- Урок 33. 00:06:51API routes to GET profile info and Posts of user
- Урок 34. 00:12:44API routes to GET Followers, Follow & Unfollow a User
- Урок 35. 00:03:27API to update Profile
- Урок 36. 00:05:21API to Update Password & Message Popup Settings
- Урок 37. 00:08:06Dynamic Pages in NextJs
- Урок 38. 00:05:52Bring Profile Data from Backend
- Урок 39. 00:10:03ProfileMenuTabs Component
- Урок 40. 00:15:52ProfileHeader Component
- Урок 41. 00:14:45Followers & Following Components
- Урок 42. 00:07:58Adding Functionality to Follow & Unfollow a User
- Урок 43. 00:02:12Create a Root User
- Урок 44. 00:19:19UpdateProfile Component
- Урок 45. 00:18:19Settings Component
- Урок 46. 00:06:17Adding Functionality to update Settings
- Урок 47. 00:07:42[LEGACY] Only see the posts of users you are following
- Урок 48. 00:10:26[UPDATED] Only see the posts of users you are following
- Урок 49. 00:03:07Creating Notification Model
- Урок 50. 00:09:18API for newLike Notification
- Урок 51. 00:07:56API for newComment Notification
- Урок 52. 00:07:00API for newFollower Notification
- Урок 53. 00:06:52Fetching Notifications from Backend
- Урок 54. 00:08:42Layout for Notifications Page
- Урок 55. 00:06:23NewLike & NewComment Components
- Урок 56. 00:05:59NewFollower Notification
- Урок 57. 00:08:06PostId page
- Урок 58. 00:03:45Creating ChatModel
- Урок 59. 00:07:52Adding Data inside MongoAtlas
- Урок 60. 00:07:36Bringing Chats from Backend
- Урок 61. 00:14:58Rendering the Chats
- Урок 62. 00:01:12Quickly fixing a bug
- Урок 63. 00:07:04ChatListSearch Component
- Урок 64. 00:07:21Introduction to Socket.io
- Урок 65. 00:07:45Keeping a track of users on server
- Урок 66. 00:04:11Displaying Online users
- Урок 67. 00:09:31Fetching Messages of a chat
- Урок 68. 00:05:56Creating Layout for Messages and Banner
- Урок 69. 00:02:59MessageInputField
- Урок 70. 00:06:29Creating Message
- Урок 71. 00:13:45Sending a new Message
- Урок 72. 00:06:26Handling No Chat Found
- Урок 73. 00:19:37Receiving the Messages
- Урок 74. 00:03:13Scrolling on newMsg
- Урок 75. 00:07:50Deleting a Message
- Урок 76. 00:05:59Deleting a chat
- Урок 77. 00:17:39Receiving Messages on any page
- Урок 78. 00:01:23Quick tip to clean up the code a bit
- Урок 79. 00:13:25API to Reset Password
- Урок 80. 00:00:50Quickly fixing a bug
- Урок 81. 00:13:26Working on the frontend
- Урок 82. 00:04:21Setting up the components
- Урок 83. 00:10:01Making Layout Responsive
- Урок 84. 00:13:36Like Posts With Sockets
- Урок 85. 00:20:11Implementing RealTime Like Notification
- Урок 86. 00:14:12Adding the Cropper
- Урок 87. 00:09:07Adding Functionality to Buttons
- Урок 88. 00:06:14Deploying to Heroku
- Урок 89. 00:00:30Final Thoughts
Автор - udemy
Комментарии
MIKEБудет ли ок если я начну этот курс не зная next.js ?
Anonymousавтор не ставит пробелы...ааа меня прям корежет от этого
Anonymous Anonymousзамечал что индусы почему то любят такой формат без "табуляции" мб национальный паттерн