Это пробный урок. Оформите подписку, чтобы получить доступ ко всем материалам курса. Премиум

  1. Урок 1. 00:01:28
    Course promo video (from course home page)
  2. Урок 2. 00:08:09
    Setup and creating our first app
  3. Урок 3. 00:07:26
    Creating a server
  4. Урок 4. 00:04:35
    Rendering content on the web page
  5. Урок 5. 00:03:59
    Supporting additional pages
  6. Урок 6. 00:04:49
    Adding a routing file
  7. Урок 7. 00:06:32
    Handling POST/GET requests (form submissions)
  8. Урок 8. 00:07:51
    npm init
  9. Урок 9. 00:04:26
    Installing our first npm package
  10. Урок 10. 00:02:44
    npm install
  11. Урок 11. 00:02:20
    Telling git to ignore node_modules (skip if not using git)
  12. Урок 12. 00:05:39
    Setting up our project
  13. Урок 13. 00:05:25
    Installing Express
  14. Урок 14. 00:03:28
    Rendering some content on the web page
  15. Урок 15. 00:08:16
    Creating our first Pug template
  16. Урок 16. 00:02:40
    Rendering a dynamic page title
  17. Урок 17. 00:04:23
    Extending another pug template file
  18. Урок 18. 00:01:48
    Quick html improvements
  19. Урок 19. 00:06:08
    Middleware: Redirecting the user if not logged in
  20. Урок 20. 00:07:27
    Adding the login route
  21. Урок 21. 00:08:37
    Creating the login page
  22. Урок 22. 00:07:01
    Adding Bootstrap
  23. Урок 23. 00:07:52
    Serving static files
  24. Урок 24. 00:13:59
    Login CSS
  25. Урок 25. 00:06:54
    Creating the register page
  26. Урок 26. 00:06:27
    Checking that the passwords match
  27. Урок 27. 00:05:37
    Adding body parser
  28. Урок 28. 00:09:38
    Checking for empty fields
  29. Урок 29. 00:06:18
    Getting started with MongoDB
  30. Урок 30. 00:10:37
    Connecting to the database
  31. Урок 31. 00:09:19
    Creating a reusable database connection
  32. Урок 32. 00:09:23
    Creating the User Schema (mongoose)
  33. Урок 33. 00:07:38
    Checking if username or emails are already in use
  34. Урок 34. 00:04:07
    Async and Await explanation
  35. Урок 35. 00:04:59
    Checking if the username or email are already in use
  36. Урок 36. 00:05:30
    Inserting a user into the collection
  37. Урок 37. 00:03:26
    Adding timestamps to our data
  38. Урок 38. 00:06:41
    Hashing the password
  39. Урок 39. 00:07:46
    Sessions
  40. Урок 40. 00:03:16
    Passing the logged in user to the client
  41. Урок 41. 00:13:39
    Logging in
  42. Урок 42. 00:09:46
    Bootstrap grid intro
  43. Урок 43. 00:08:34
    Creatig a responsive layout
  44. Урок 44. 00:04:01
    Adding FontAwesome
  45. Урок 45. 00:07:15
    Choosing our navigation bar icons
  46. Урок 46. 00:05:39
    Styling the navigation bar
  47. Урок 47. 00:07:29
    Navigation icon colours
  48. Урок 48. 00:03:28
    Logging out
  49. Урок 49. 00:08:52
    Adding the page title
  50. Урок 50. 00:09:52
    Mixins
  51. Урок 51. 00:04:41
    Setting the default profile picture
  52. Урок 52. 00:05:44
    Styling the post form container
  53. Урок 53. 00:07:34
    Styling the textarea
  54. Урок 54. 00:06:50
    Adding a common javascript file
  55. Урок 55. 00:05:32
    Getting the entered text from the textbox
  56. Урок 56. 00:03:45
    Enabling the submit button when the user types
  57. Урок 57. 00:05:49
    Adding a click handler to the post button
  58. Урок 58. 00:05:41
    Rest API basic explanation
  59. Урок 59. 00:06:29
    Post API route
  60. Урок 60. 00:03:49
    Sending a bad request when the data is invalid
  61. Урок 61. 00:05:54
    Creating the posts Mongoose schema
  62. Урок 62. 00:10:21
    Inserting the post into the database
  63. Урок 63. 00:05:08
    Handling the response from the server
  64. Урок 64. 00:06:49
    Outputting the post content
  65. Урок 65. 00:05:17
    Outputting the user info from the post
  66. Урок 66. 00:08:10
    Styling the post body
  67. Урок 67. 00:09:18
    Styling the comment, retweet and like buttons
  68. Урок 68. 00:05:02
    Hover styles of the comment, retweet and like buttons
  69. Урок 69. 00:04:57
    Creating the home page JavaScript file
  70. Урок 70. 00:06:19
    Getting posts from the database
  71. Урок 71. 00:05:35
    Outputting posts on the page
  72. Урок 72. 00:04:19
    Populating the posted by data
  73. Урок 73. 00:02:11
    Populating our login details to save us time
  74. Урок 74. 00:05:55
    Calculating the timestamp of the posts
  75. Урок 75. 00:01:02
    Ordering the posts by newest first
  76. Урок 76. 00:02:51
    Adding the likes field to the schemas
  77. Урок 77. 00:03:51
    Like button click handler
  78. Урок 78. 00:09:10
    Getting the post id from the clicked element
  79. Урок 79. 00:03:38
    Rest API request types overview
  80. Урок 80. 00:06:16
    Making a PUT request
  81. Урок 81. 00:05:30
    Checking if if the user has already like the post
  82. Урок 82. 00:09:04
    Inserting the like
  83. Урок 83. 00:04:41
    Unliking posts
  84. Урок 84. 00:03:09
    Returning the like result to the client
  85. Урок 85. 00:06:52
    Updating the button to show the new number of likes
  86. Урок 86. 00:05:41
    Passing the user logged in info to the client
  87. Урок 87. 00:06:35
    Changing button colour when post is liked
  88. Урок 88. 00:01:48
    Showing correct button colour when page loads
  89. Урок 89. 00:04:34
    Setting up the retweet route
  90. Урок 90. 00:06:40
    Adding the retweet fields to the schema
  91. Урок 91. 00:06:28
    Retweeting posts
  92. Урок 92. 00:02:27
    Retweeting posts - Fix
  93. Урок 93. 00:07:17
    Showing the number of retweets next to the button
  94. Урок 94. 00:01:23
    Setting retweet button colour when page is loaded
  95. Урок 95. 00:08:00
    Rendering the retweet
  96. Урок 96. 00:03:05
    Populating the retweet's postedBy field
  97. Урок 97. 00:05:59
    Adding the retweet message indicator
  98. Урок 98. 00:07:11
    Opening the reply modal popup
  99. Урок 99. 00:03:05
    Adding the post form in the modal
  100. Урок 100. 00:03:20
    Enabling the submit reply button when the user types
  101. Урок 101. 00:07:13
    Making the request to get the post when modal opens
  102. Урок 102. 00:05:05
    Refactoring the get posts function
  103. Урок 103. 00:05:13
    Getting a single post by ID
  104. Урок 104. 00:04:56
    Outputting the post into the reply modal
  105. Урок 105. 00:04:21
    Clearing the reply modal when it is closed
  106. Урок 106. 00:09:38
    Sending the reply to the server
  107. Урок 107. 00:02:42
    Inserting the reply into the database
  108. Урок 108. 00:02:22
    Reloading the page after a reply is submitted
  109. Урок 109. 00:08:34
    Outputting the reply
  110. Урок 110. 00:03:52
    Sending the user to the posts page on click
  111. Урок 111. 00:06:34
    Creating the posts route
  112. Урок 112. 00:03:42
    Loading the post on the post page
  113. Урок 113. 00:10:55
    Loading the replies to the post on the post page
  114. Урок 114. 00:02:28
    Fixing a bug in the replies
  115. Урок 115. 00:06:27
    Large font size for the post we're viewing
  116. Урок 116. 00:11:30
    Adding the delete button to our own posts
  117. Урок 117. 00:02:37
    Styling the delete button
  118. Урок 118. 00:03:28
    Getting the id of the post we want to delete
  119. Урок 119. 00:06:10
    Making the ajax call to delete a post
  120. Урок 120. 00:06:20
    Deleting the post
  121. Урок 121. 00:03:16
    Creating the profile route file
  122. Урок 122. 00:03:02
    Creating the profile page pug file
  123. Урок 123. 00:08:11
    Accessing the profile page by username
  124. Урок 124. 00:03:03
    User not found error message
  125. Урок 125. 00:03:15
    Accessing the profile page by ID
  126. Урок 126. 00:08:23
    Styling the profile image + cover photo
  127. Урок 127. 00:08:19
    Message button style
  128. Урок 128. 00:05:52
    Styling the follow button
  129. Урок 129. 00:05:00
    Outputting the user details
  130. Урок 130. 00:04:49
    Styling the user details
  131. Урок 131. 00:07:49
    Creating the profile tabs
  132. Урок 132. 00:05:11
    Loading posts on the profile page
  133. Урок 133. 00:07:41
    Including/excluding the replies
  134. Урок 134. 00:06:38
    Implementing the replies tab
  135. Урок 135. 00:04:10
    Following and followers schema changes
  136. Урок 136. 00:05:46
    Getting the user ID when we press the follow button
  137. Урок 137. 00:05:42
    Creating the follow endpoint
  138. Урок 138. 00:06:00
    Checking if the user is already following the person
  139. Урок 139. 00:06:51
    Following and unfollowing the user
  140. Урок 140. 00:08:23
    Updating the button when we follow/unfollow a user
  141. Урок 141. 00:00:53
    Updating the text of the button when we follow/unfollow a user
  142. Урок 142. 00:07:22
    Updating the following/followers count
  143. Урок 143. 00:04:32
    Creating the following/followers page
  144. Урок 144. 00:09:15
    Getting the following/followers data from the database
  145. Урок 145. 00:08:06
    Outputting the users
  146. Урок 146. 00:02:56
    Styling the users list
  147. Урок 147. 00:05:22
    Adding the follow button to the user list
  148. Урок 148. 00:06:03
    Only showing posts from people we're following
  149. Урок 149. 00:03:15
    Following count bug fix
  150. Урок 150. 00:05:29
    Adding the profile picture upload button
  151. Урок 151. 00:02:55
    Creating the image upload modal
  152. Урок 152. 00:04:02
    Adding Cropper JS (the cropping library)
  153. Урок 153. 00:09:45
    Loading the image preview into the modal
  154. Урок 154. 00:06:38
    Adding the cropper functionality
  155. Урок 155. 00:04:47
    Converting the image upload data to a blob
  156. Урок 156. 00:03:57
    Image upload ajax call
  157. Урок 157. 00:09:21
    Accessing the image on the server
  158. Урок 158. 00:06:42
    Storing the uploaded image in the correct location
  159. Урок 159. 00:11:09
    Updating the user's profile picture in the database
  160. Урок 160. 00:06:56
    Adding the upload button to the cover photo section
  161. Урок 161. 00:02:21
    Cover photo upload modal popup
  162. Урок 162. 00:02:32
    Cover photo cropping
  163. Урок 163. 00:07:02
    Uploading the cover photo
  164. Урок 164. 00:05:42
    Pin post modal
  165. Урок 165. 00:09:15
    Pinning posts
  166. Урок 166. 00:02:57
    Changing the icon colour for the pinned post
  167. Урок 167. 00:03:01
    Pinned post label
  168. Урок 168. 00:07:30
    Displaying the pinned post on the profile
  169. Урок 169. 00:06:01
    Unpinning posts
  170. Урок 170. 00:08:02
    Creating the search page
  171. Урок 171. 00:06:56
    Styling the search box
  172. Урок 172. 00:08:17
    Creating the search timer
  173. Урок 173. 00:06:18
    Searching for posts
  174. Урок 174. 00:02:04
    Outputting the search posts
  175. Урок 175. 00:06:21
    Searching for users
  176. Урок 176. 00:02:31
    Outputting the search users
  177. Урок 177. 00:07:24
    Creating the inbox page routes
  178. Урок 178. 00:03:34
    Creating the new message button
  179. Урок 179. 00:03:05
    New message page elements
  180. Урок 180. 00:07:26
    Styling the new message page elements
  181. Урок 181. 00:06:11
    Adding the user search timer
  182. Урок 182. 00:05:20
    Output selectable users
  183. Урок 183. 00:06:36
    Selecting users
  184. Урок 184. 00:03:15
    Leaving selected users out of the search results
  185. Урок 185. 00:05:12
    Outputting the selected users
  186. Урок 186. 00:04:15
    Styling the selected users
  187. Урок 187. 00:07:32
    Removing the selected user
  188. Урок 188. 00:05:40
    Creating the chat schema
  189. Урок 189. 00:06:12
    Creating the chat routes
  190. Урок 190. 00:07:08
    Creating chats
  191. Урок 191. 00:07:02
    Getting the chats
  192. Урок 192. 00:05:35
    Outputting the chat elements
  193. Урок 193. 00:03:33
    Styling the chat items
  194. Урок 194. 00:07:11
    Getting the chat name
  195. Урок 195. 00:06:46
    Showing the chat images
  196. Урок 196. 00:05:37
    Styling the chat images
  197. Урок 197. 00:03:16
    Ellipsis for overflowing text
  198. Урок 198. 00:02:21
    Creating the chat page
  199. Урок 199. 00:05:56
    Getting the chat data for the page
  200. Урок 200. 00:06:48
    Checking that the chat exists
  201. Урок 201. 00:10:47
    Accessing the chat by user ID
  202. Урок 202. 00:01:31
    Sorting the chats by most recent first
  203. Урок 203. 00:03:02
    Adding the chat page elements
  204. Урок 204. 00:04:26
    Making the page take up the fill window height
  205. Урок 205. 00:04:36
    Styling the chat title bar
  206. Урок 206. 00:05:15
    Styling the message text box
  207. Урок 207. 00:03:47
    Styling the chat messages container
  208. Урок 208. 00:03:10
    Group chat images
  209. Урок 209. 00:03:44
    Styling the group chat images
  210. Урок 210. 00:10:47
    Limiting the number of displayed chat images
  211. Урок 211. 00:04:11
    Adding the chat name modal popup
  212. Урок 212. 00:03:56
    Making the ajax call to change the name
  213. Урок 213. 00:03:30
    Updating the chat name in the database
  214. Урок 214. 00:06:01
    Get chat route
  215. Урок 215. 00:02:09
    Get chat data by chat ID
  216. Урок 216. 00:06:21
    Message submitted event handlers
  217. Урок 217. 00:03:22
    Send message function
  218. Урок 218. 00:04:26
    Creating the message schema
  219. Урок 219. 00:05:50
    Sending the message to the database
  220. Урок 220. 00:07:13
    Creating the message html
  221. Урок 221. 00:04:23
    Adding the main style for the messages
  222. Урок 222. 00:06:05
    Styling our own messages
  223. Урок 223. 00:03:23
    Handling a send message failure
  224. Урок 224. 00:07:47
    Outputting the latest message
  225. Урок 225. 00:04:01
    Getting the messages from the database
  226. Урок 226. 00:04:33
    Outputting all the chat messages
  227. Урок 227. 00:08:33
    Adding classes to the first and last messages in a group of messages
  228. Урок 228. 00:04:01
    Setting the border radius of our messages
  229. Урок 229. 00:02:25
    Setting the border radius of their messages
  230. Урок 230. 00:04:09
    Outputting the sender name
  231. Урок 231. 00:05:33
    Outputting the sender profile picture
  232. Урок 232. 00:01:59
    Fixing a bug in the scrolling of messages
  233. Урок 233. 00:05:42
    Scrolling messages to the bottom automatically
  234. Урок 234. 00:06:09
    Showing a loading spinner while messages are loading
  235. Урок 235. 00:03:54
    Installing socket io
  236. Урок 236. 00:04:28
    Connecting to socket io from the client
  237. Урок 237. 00:09:37
    Creating our setup socket event handler
  238. Урок 238. 00:03:35
    Joining a chat room
  239. Урок 239. 00:06:43
    Sending typing notifications
  240. Урок 240. 00:01:54
    Safari messages bug fix
  241. Урок 241. 00:05:35
    Showing the typing dots gif when user is typing
  242. Урок 242. 00:09:08
    Hiding the typing dots when the user stops typing
  243. Урок 243. 00:01:25
    Hiding the typing dots when a message is sent
  244. Урок 244. 00:05:39
    Sending a new message event
  245. Урок 245. 00:06:52
    Handling incoming messages
  246. Урок 246. 00:03:22
    Creating the notification page
  247. Урок 247. 00:05:00
    Creating the notification schema
  248. Урок 248. 00:05:57
    Inserting notifications
  249. Урок 249. 00:04:29
    Sending a follow notification
  250. Урок 250. 00:09:38
    Sending notifications for likes, retweets and replies
  251. Урок 251. 00:08:45
    Sending notifications for messages
  252. Урок 252. 00:03:41
    Creating the notifications api route
  253. Урок 253. 00:07:24
    Retrieving notifications from the database
  254. Урок 254. 00:07:21
    Creating the notifications html
  255. Урок 255. 00:06:00
    Creating the notification text
  256. Урок 256. 00:04:20
    Creating the notification links
  257. Урок 257. 00:02:10
    Setting the active class on the notifications
  258. Урок 258. 00:06:54
    Marking a notification as opened
  259. Урок 259. 00:10:49
    Notification click handlers
  260. Урок 260. 00:04:10
    Marking all notifications as read
  261. Урок 261. 00:06:25
    Adding the notifications/messages badge to the nav bar
  262. Урок 262. 00:05:27
    Getting the number of unread chats
  263. Урок 263. 00:01:52
    Adding the number to the unread messages badge
  264. Урок 264. 00:06:12
    Adding the number to the unread notifications badge
  265. Урок 265. 00:06:24
    Sending the notification socket event
  266. Урок 266. 00:03:07
    Handling incoming notifications
  267. Урок 267. 00:06:10
    Outputting the popup notification
  268. Урок 268. 00:05:27
    Styling the popup notification list
  269. Урок 269. 00:02:16
    Making the notifications slide into view
  270. Урок 270. 00:05:07
    Outputting the popup messages
  271. Урок 271. 00:06:06
    Marking all messages as read
  272. Урок 272. 00:03:50
    Making unread messages have a blue background
  273. Урок 273. 00:03:27
    Incoming message fix