آموزش وب پک 4: فراتر از اصول

سرفصل ها و درس ها

معرفی Introduction

• چگونه از این دوره کمک بگیریم How to get help with this Course

• مواد و کد دوره اضافی Additional Course Materials and Code

توسعه واکنشی (معروف به Optimal Dev Experience) Reactive Development (aka Optimal Dev Experience)

• راه اندازی و اجرا با Webpack Dev Server Up and Running with Webpack Dev Server

• اولین لودرهای ما برای CSS Our First Loaders for CSS

• خطاها و لودرهای بهتر برای HTML و تصاویر Better Errors and Loaders for HTML & Images

• مبانی بابل Babel Basics

• Babel Polyfills، Transforms & Presets Babel Polyfills, Transforms & Presets

• DIY Webpack Dev Server با Express Middleware DIY Webpack Dev Server with Express Middleware

• Hot Reload هر دو کلاینت و سرور با Nodemon Hot Reloading Both Client and Server with Nodemon

• اشکال زدایی گره با ابزارهای توسعه دهنده کروم Debugging Node with Chrome DevTools

ماجراجویی خود را انتخاب کنید Choose Your Own Adventure

• Hooking Up React Hooking Up React

• Hooking up React - Part 2: Stateful Reloading Hooking up React - Part 2: Stateful Reloading

• اتصال پیش پردازنده های HTML مانند EJS/Pug/Handlebars Hooking up HTML Preprocessors like EJS/Pug/Handlebars

• اتصال به پیش پردازنده های CSS مانند SASS/LESS و قلم Hooking up CSS Preprocessors like SASS/LESS & Stylus

• اتصال Js در CSS با ماژول های Emotion و CSS Hooking up Js in CSS with Emotion and CSS Modules

• اتصال تایپ اسکریپت Hooking up Typescript

• اتصال Angular Hooking up Angular

• اتصال VueJS Hooking up VueJS

بهینه سازی برای تولید Optimizing for Production

• راه اندازی میزبانی تولید با Heroku Setup Production Hosting with Heroku

• CSS آماده تولید Production Ready CSS

• حذف جاوا اسکریپت فقط برای توسعه با DefinePlugin Stripping development-only Javascript with the DefinePlugin

• Minification و Mangling جاوا اسکریپت با Babel و Uglify Javascript Minification and Mangling with Babel and Uglify

• بهینه سازی تمام دارایی ها با فشرده سازی GZip و Brotili Optimizing All Assets with GZip and Brotili Compression

• ساختن وبلاگ با React Building out the Blog with React

• تجزیه علامت گذاری برای وبلاگ نویسی و داده های متا Parsing Markdown for Blogging and Meta Data

• SplitChunks و Bundle Analyzer SplitChunks and the Bundle Analyzer

رندر سمت سرور و واردات پویا Server-side Rendering & Dynamic Importing

• رندر JS سمت سرور با Express و React Server-side Render JS with Express and React

• سمت سرور هر نوع فایلی را با Webpack رندر کنید Server-side Render any Filetype with Webpack

• مجموعه یکپارچه - قسمت 1 Unified Compilation - Part 1

• مجموعه یکپارچه - قسمت 2 Unified Compilation - Part 2

• اضافه کردن چندین صفحه با React Router Adding Multiple Pages with React Router

• نحو واردات پویا Dynamic Import Syntax

• React Universal Components React Universal Components

• Async JS/CSS Chank بارگیری موازی (معروف به جام مقدس) Async JS/CSS Chunk Loading in Parallel (aka the Holy Grail)

ساخت یک سایت چند دامنه با ادغام Redux Building a Multi-Domain Site with Redux integration

• 2 استراتژی برای چند دامنه در توسعه 2 Strategies for Multiple-Domains in Development

• محدوده بندی داده های شما در هر دامنه Scoping Your Data per Domain

• قالب CSS در هر دامنه Theming CSS per Domain

• صفحات مقالات را برای 2 قهرمان ما بسازید Build out the Articles Pages for our 2 Heroes

• اصول ردوکس: فروشگاه، کاهنده و عمل. Redux Basics: The store, the reducer and the action.

• واکشی مقالات از یک API با Redux Thunk Fetching Articles from an API with Redux Thunk

• Redux بر روی مشتری. در حال اتمام واکشی مقاله ما Redux on the client. Finishing our Article fetch

• Redux در رندر سمت سرور ذخیره می کند Redux stores in the Server side render

ضمیمه Appendix

• راهنمای ارتقا Webpack 4 Webpack 4 Upgrade Guide

• بعدش چی میخوای ببینی؟ What do you want to see next?