Create a Twitter-like App with Python Django JavaScript and React. Full TUTORIAL
Django x React has never been so easy. Build a twitter-like app in Django, Javascript, & React.js. Step-by-Step. Topics:
- Pure Django + JavaScript
- Django Rest Framework
- React.js
- Auth
- & MUCH more
0:00:00 1. Welcome
0:01:48 2. Walkthrough
0:08:11 3. Requirements.txt
0:11:17 4. Setup Django Project
0:16:00 5. Add Project to VS Code
0:21:39 6. Update VS Code Config
0:28:45 7. Our Roadmap
0:32:31 8. The Tweets Model
0:39:35 9. Store Data from Django Model
0:43:10 10. Intro to URL Routing and Dynamic Routing
0:47:57 11. Handling Dynamic Routing
0:51:32 12. Dynamic View into REST API Endpoint
0:55:50 13. Our First Template
1:00:07 14. Bootstrap & Django Templates
1:04:17 15. Tweet List View
1:08:01 16. Dynamic Load Tweets via JavaScript
1:13:48 17. Replace HTML Content with JavaScript
1:18:19 18. Tweets to HTML via JavaScript
1:25:56 19. Format Tweet Method
1:29:30 20. Like Button Rendering
1:36:48 21. Rapid Implement of Bootstrap Theme
1:48:00 22. Tweet Create Form
1:56:55 23. Tweet Form by Hand
2:02:25 24. Successful Form Redirect
2:05:00 25. Safe URL Redirect
2:08:30 26. Prevent Form Submit via JavaScript
2:13:36 27. Sending Form Data via pure JavaScript
2:22:06 28. Handling Ajax Requests
2:26:47 29. Serialize Django Model Object
2:33:33 30. Append New Tweet & Reorder
2:37:09 31. Handling Form Errors
2:42:18 32. Rendering the Error Message via Vanilla JavaScript
2:49:28 33. Users & Tweets
2:57:09 34. Django Admin
3:07:23 35. Associate Authenticated User to Object
3:13:00 36. Permissions & Roadmap
3:16:16 37. Install Django Rest Framework
3:18:20 38. Django Forms to Django Rest Framework Serializer
3:27:42 39. Django Views to Django Rest Framework Views
3:35:50 40. Permissions and Authentication Classes Decorators for DRF APIs
3:43:08 41. Delete Tweet API View
3:49:43 42. Adding a Like Field
3:56:00 43. Understanding Setting ManyToMayFields
4:03:32 44. Tweet Action View
04:11:02 45. JavaScript Tweet Action Handler
04:15:56 46. CSRF & Client Side Action Buttons
04:24:18 47. Retweeting Logic
04:32:30 48. Two Types of Serializers
04:41:29 49. Internal App Urls
04:45:15 50. Setting up Tests in Django
05:12:14 51. Verify or Install Node.js
05:15:57 52. Create React App
05:20:29 53. Understanding Functional Components
05:26:27 54. Ajax lookup via XHR in React.js
05:32:18 55. Handling CORS and Invalid HOST_HEADER in Django
05:35:35 56. Functional Components in React
05:42:52 57. React.js Action Btn
05:47:07 58. Using JavaScript Modules
05:53:00 59. Improved Action Btn
05:57:31 60. Understanding setState Hook
06:03:02 61. Handling a Form in React
6:08:55 62. Pass from Parent Component to Child with useEffect
06:19:10 63. Adjust the React Render Process
06:23:07 64. React Rendered by Django
06:30:22 65. Render React App via Any Django Template
06:38:36 66. A Better XHR Lookup
06:43:54 67. Create Tweet in React
06:52:56 68. Dev Authentication
06:58:34 69. Handling New Tweet
07:06:06 70. API Methods in React
07:09:55 71. Tweet Action Btn
07:16:52 72. Rendering the ReTweet
07:23:28 73. Improving the Tweet Action Button
07:30:03 74. Prepending Dynamic Retweets
07:37:24 75. Set Data Props on ReactDOM Render
07:42:19 76. Limit List View by Username
07:45:29 77. Rendering Limited Tweet List by Username
07:53:03 78. Tweets Module Clean Up
08:03:06 79. Lookup & Render & Embed Individual Tweets
08:11:26 80. Linking Individual Tweets
08:23:09 81. Build and Use On Django
08:36:00 82. Clean Up API Urls and Views
08:40:12 83. Login Required Redirect
08:46:42 84. Authentication & Registration
09:05:46 85. User Profiles
09:13:21 86. Handling Profile Does Not Exist
09:15:33 87. Signals to Create Profile Objects
09:21:43 88. Save 2 Models in 1 Form and 1 View
09:35:32 89. ManyToManyField and Reverse Relations
09:46:47 90. Followers and Following
09:56:50 91. Follow Button Logic and Endpoint
10:09:29 92. Profile Following Unit Test Cases
10:16:00 93. User Feed Including Following
10:21:50 94. More Efficient Backend Lookups and Custom Model Managers
10:32:30 95. More Efficient List Views with Pagination
10:38:26 96. User Profile Serializer
10:47:07 97. Handling our New List View Response
10:50:29 98. Handling Pagination in React
10:58:20 99. Display User Within Tweet
11:08:17 100. Display Tweet User Details
11:19:50 101. Feed View Component
11:29:20 102. Build for the Feed
11:37:07 103. User Profile API Detail
11:37:07 104. Passing the Request to Serializers
11:41:11 105. Render Profile Badge Component
11:57:21 106. The Follow Button
12:14:05 107. Removing Redundant Profile View
12:17:49 108. Display Follower Count with Numeral.js
12:27:52 109. Final Build
12:36:52 110. Thank you and next steps
Смотрите видео Create a Twitter-like App with Python Django JavaScript and React. Full TUTORIAL онлайн без регистрации, длительностью часов минут секунд в хорошем качестве. Это видео добавил пользователь CodingEntrepreneurs 20 Апрель 2020, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 503,688 раз и оно понравилось 16 тысяч людям.