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 мин
Категория
React.js
Количество уроков
89 Видео
Дата добавления
26 сент. 2021 г., 22:11
Язык
Английский
Дата выхода
12 авг. 2021 г., 03:00
Этот курс НЕ ДЛЯ АБСОЛЮТНЫХ НАЧИНАЮЩИХ. У Вас должен быть в портфолио хотя бы 1 проект MERN. Этот курс предназначен для тех, кто хочет выйти из своей зоны комфорта и создать проект, который научит вас ценным навыкам.
Создайте социальную среду с помощью MERN - React, Nextjs, socket io для чата в реальном времени и уведомлений, бесконечной прокрутки и многого другого ..
Этот курс включает в себя…
- Одно из самых сложных приложений, которые вы собираетесь создавать. 13 часов видеоконтента для одного приложения, которое отлично подойдет для вашего резюме.
- React и NextJs (для страниц с рендерингом на стороне сервера) для нашего Frontend и Express с Node на бэкэнде. Мы собираемся использовать Socket io для соединения в реальном времени между несколькими клиентами для обмена сообщениями.
- Создание сложных и взаимосвязанных моделей MongoDB для хранения информации о пользователях, сообщениях, которые они отправляют и получают, их уведомлениях, подписках и подписчиках пользователя. Мы собираемся хранить все в нашей базе данных.
- Мы собираемся показать количество онлайн-пользователей в нашем приложении зарегистрированному пользователю, как и в любой большой социальной сети.
- Общайтесь в реальном времени с несколькими пользователями. Поэтому не нужно обновлять страницу, чтобы проверить, есть ли новое сообщение. Все будет происходить в реальном времени. Также мы собираемся воспроизводить звук уведомления при появлении нового сообщения.
- Мы собираемся показывать только сообщения пользователей, на которых вы подписаны. Точно так же и в больших социальных сетях.
- У нас будут уведомления в реальном времени. Когда кому-то нравится ваше сообщение или комментарий к нему, или он начинает подписываться на вас, появляется новое уведомление.
- Обрежьте изображения перед загрузкой в облако.
- Бесконечная прокрутка для автоматического включения новых сообщений из серверной части, когда пользователь находится в нижней части страницы.
- Semantic-UI как фреймворк CSS.
- Создание полностью адаптивного макета во внешнем интерфейсе, только с использованием JavaScript и без медиа запросов css. Кроме того, он будет оптимизирован для рендеринга на стороне сервера (SSR).
- Загрузите изображения профиля. Также создавайте посты с картинками. Мы собираемся хранить все изображения в CLOUDINARY.
- Также мы собираемся создать пользователя root. Этот пользователь может удалить любой пост или удалить любой комментарий внутри приложения.
- Мы собираемся отображать всю информацию о ваших подписчиках и подписках. Обязательно посмотрите вступительное видео. Я там подробно об этом говорил.
- Кроме того, мы собираемся дать пользователю возможность обновить изображение профиля или информацию профиля. У нас будет вкладка настроек, где вы сможете обновить свой пароль и настройки всплывающих сообщений.
- Я собираюсь научить вас, как заполнять поля внутри MongoDB, я также собираюсь показать вам, как связать модели друг с другом, чтобы нам не приходилось хранить фиксированные значения в каждой модели.
- Также мы собираемся добавить функцию сброса пароля. Мы собираемся использовать NodeMailer и Sendgrid, чтобы отправить электронное письмо со ссылкой пользователю для сброса пароля.
- В конце мы собираемся развернуть все в HEROKU.
Посмотреть больше
Это пробный урок. Оформите подписку, чтобы получить доступ ко всем материалам курса. Премиум
-
Урок 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замечал что индусы почему то любят такой формат без "табуляции" мб национальный паттерн
