توسعه وب فول استک با جاوااسکریپت و PostgreSQL
✅ سرفصل و جزئیات آموزش
آنچه یاد خواهید گرفت:
- کدنویسی صفحات وب اپلیکیشنها با HTML و CSS
- استفاده از سیستم کنترل نسخه گیت و پلتفرم گیتهاب برای مدیریت مخزن کدهای منبع
- افزایش تعاملپذیری وب اپلیکیشنها با زبان برنامهنویسی جاوااسکریپت از جمله استفاده از ReactJS برای ساخت رابطهای کاربری قابل کامپوز
- درک SQL برای ارتباط با سیستم پایگاه داده PostgreSQL به منظور ذخیره داده اپلیکیشنهای خود
- توسعه API بکاند به فرمت جیسان با استفاده از نودجیاس (جاوااسکریپت) و کتابخانه ExpressJS
- ساخت اپلیکیشن موبایل با زبان جاوااسکریپت و فریمورک React Native
پیشنیازهای دوره
- تجربه اولیه کار با کامپیوتر و برنامهنویسی توصیه میشود
توضیحات دوره
در سفری کامل در دنیای توسعه وب فول استک شرکت کنید و مباحثی از بخش فرانتاند تا بکاند، پایگاه داده و حتی اپلیکیشن موبایل را یاد بگیرید.
با مبانی HTML و CSS شروع خواهید کرد.
سپس با کنترل نسخه توسط گیت و گیتهاب آشنا میشوید.
بعد به زبان برنامهنویسی جاوااسکریپت معرفی میشوید تا وبسایت خود را پویا کنید.
کتابخانه فرانتاند ReactJS هم آموزش داده میشود تا بتوانید اپلیکیشنهای تکصفحهای بسازید و رابط کاربری را به صورت اعلامی با کامپوننتهای ریاکت توسعه دهید.
همچنین با زبان ساختار یافته SQL آشنا میشوید تا بتوانید پایگاه داده PostgreSQL (یا Postgres) را کوئری کنید.
در بخش بکاند، کار با نودجیاس (که به عنوان جاوااسکریپت سمت سرور شناخته میشود) به همراه فریمورک ExpressJS آموزش داده میشود تا یک API بسازید که داده را به فرمت جیسان رد و بدل کند.
شما یاد میگیرید چطور فرانتاند را به بکاند متصل کنید و اطلاعات را در پایگاه داده ذخیره کنید، تا دفعه بعد که اپلیکیشن را بارگذاری کردید، داده حفظ شده باشند.
علاوه بر این، نحوه ساخت اپلیکیشن موبایل برای سیستمهای عامل اندروید و iOS با زبان جاوااسکریپت و فریمورک React Native آموزش داده میشود. این دانش از ریاکت برای وب به شما کمک میکند الگوهای مشابهی را در توسعه موبایل بهکار ببرید.
این دوره برای چه کسانی مناسب است؟
- توسعهدهندگانی که علاقهمند به ساخت سیستمهای اطلاعاتی فول استک از فرانتاند تا بکاند، شامل پایگاه داده و اپلیکیشن موبایل هستند.
توسعه وب فول استک با جاوااسکریپت و PostgreSQL
-
زبان نشانهگذاری هایپرتکست (HTML) 01:32
-
HTML Boilerplate ایندکس 04:37
-
پیشنمایش لایو - افزونه ویژوال استودیو کد 01:49
-
تگهای HTML - پاراگراف 02:14
-
وبسایتی برای تولید متنهای جایگزین Lorem Ipsum 00:56
-
تگهای هدینگ در HTML 04:50
-
تگهای strong و em در HTML 02:59
-
تگهای Bold و Italics در HTML 02:22
-
Indentation کد HTML 04:14
-
تگ Anchor در HTML 05:52
-
تگ تصویر در HTML 04:34
-
لیستهای مرتب و نامرتب در HTML 02:58
-
یادگیری عناصر جدید HTML 01:54
-
تگ صدا در HTML 01:15
-
تگ ویدئو در HTML 01:12
-
وایرفریم برای فرم ثبتنام 01:07
-
فایل HTML برای صفحه ثبتنام 02:43
-
برچسب و ورودی نوع متن 03:36
-
فیلد ورودی نوع ایمیل 01:28
-
فیلد ورودی از نوع پسورد 00:34
-
فیلد ورودی نوع تاریخ 01:07
-
فیلد ورودی نوع رادیویی 03:58
-
تگ textarea در HTML 02:18
-
فیلد ورودی نوع چکباکس 03:44
-
فیلد ورودی نوع ارسال (Submit) 01:36
-
Attribute اکشن فرم HTML 01:36
-
ابزارهای توسعهدهنده مرورگر 01:38
-
ارسال فرم HTML 07:23
-
اعتبارسنجی ورودی موردنیاز 03:07
-
رنگ متن در CSS 03:43
-
رنگ پسزمینه در CSS 03:00
-
تعریف CSS در فایل جداگانه 02:43
-
ترازبندی متن در مرکز در CSS 00:47
-
اشکالزدایی CSS با ابزارهای توسعه 05:16
-
مقادیر رنگ در CSS 03:14
-
سلکتور شناسه در CSS 01:41
-
سلکتور کلاس در CSS 03:31
-
مثال دکمه در بوتاسترپ 05:34
-
مدل جعبهای CSS 05:51
-
نمایش بلوک در مقابل درون خطی 02:50
-
استایلدهی مجدد لیست نامرتب 02:40
-
نمایش آیتمهای لیست به صورت خطی با سلکتور فرزند 02:55
-
نمایش آیتمها به شکل دکمه همراه با لینک 03:45
-
شبه کلاسهای هاور و Active 03:00
-
شبه کلاس آخرین فرزند 01:49
-
فیکس کردن باگ لبه داخلی دکمه 01:58
-
کلاس گروه فرم 04:17
-
استایلدهی برچسبهای گروه فرم 02:58
-
فیلدهای ورودی با عرض کامل 03:08
-
اندازه باکس به صورت Border Box 02:48
-
مستندات padding از MDN 03:17
-
Focus Outline و Box Shadow 04:56
-
انتخاب textarea و فیلد ورودی نوع تاریخ 03:15
-
لینکدهی Google Fonts 02:24
-
استایلدهی به دکمه ارسال فرم 02:12
-
کنترل نسخه کد منبع 02:10
-
ایجاد مخزن گیت 02:09
-
ساخت کامیت در گیت 03:44
-
فرمانهایی برای ساخت هویت گیت 01:54
-
ایجاد کامیت دیگر 01:52
-
راهنمای گیت 01:02
-
بررسی گیت و کنترل نسخه 02:29
-
بررسی کوتاه گیتهاب 03:29
-
ایجاد مخزن گیتهاب 02:02
-
تولید کلید SSH 03:26
-
افزودن کلید عمومی SSH به گیتهاب 01:00
-
افزودن از راه دور گیتهاب و پوش کردن 02:39
-
صفحه کامیتها در گیتهاب 01:14
-
واکشی و ادغام آخرین تغییرات با گیت 03:41
-
افزودن پچ در گیت 01:52
-
صفحه Blame در گیتهاب 01:11
-
کنترل نسخه در ویژوال استودیو کد 03:31
-
گیتهاب برای همکاری 01:58
-
تخصیص مشکل گیت هاب 02:09
-
فورک کردن مخزن در گیتهاب 03:12
-
یافتن راهحل برای مشکل گیتهاب 03:54
-
پیشنهاد تغییرات از طریق Pull Request 03:54
-
فرآیند بررسی کد 05:14
-
ادغام Pull Request 01:28
-
ردیابی مشکل پروژههای گیتهاب 02:19
-
پاکسازی و همزمانسازی با Upstream 03:23
-
اشتباهات ابتدایی در پروژههای متنباز 02:03
-
ایجاد برنچ ویژگی 03:50
-
پاکسازی بعد از ارسال Pull Request به Upstream 03:02
-
بررسی مختصر جاوااسکریپت 01:43
-
جاوااسکریپت در تب کنسول 01:24
-
دستکاری استایل با جاوااسکریپت 06:48
-
توضیحاتی درباره تغییر استایل با جاوااسکریپت 02:40
-
تغییر منبع تصویر با جاوااسکریپت 03:30
-
انتقال کد جاوااسکریپت به فایل جداگانه 01:58
-
سلکتور کوئری برای دریافت عنصر با شناسه 01:56
-
تابعی برای مدیریت کلیک جهت نمایش تصویر بعدی 04:49
-
پخش صدا هنگام کلیک روی دکمه 06:12
-
صفحه پیامها با فرم شامل textarea 01:13
-
تابع مدیریت رویداد ارسال فرم 02:43
-
بررسی مقدار textarea با استفاده از دیباگر ابزارهای توسعهدهنده کروم 05:22
-
جلوگیری از رفتار پیشفرض در ارسال فرم 02:14
-
کانتینر پیامها و آیتمهای لیست به همراه استایلدهی 04:53
-
ایجاد عناصر با مستندات و متغیرهای جاوااسکریپت 03:13
-
محتوای متنی div و پیوست فرزند 04:42
-
ریفکتور کردن کد با متغیر برای جلوگیری از تکرار 01:57
-
پاسخ جیسان از سرور جعلی بکاند 02:00
-
تعریف آرایهها و دسترسی به آنها در جاوااسکریپت 03:54
-
تعریف آبجکت لیترال و دسترسی به ویژگیها در جاوااسکریپت 02:24
-
دسترسی به ویژگی آبجکت داخل آرایه 01:45
-
ارسال درخواست HTTP با واکشی برای دریافت پستها 04:42
-
افزودن به لیست کلاس و پاکسازی مقدار textarea 02:25
-
اشکالزدایی تابع Promise Callback با ابزارهای توسعهدهنده 02:19
-
حلقه For Of برای تولید مکرر عناصر div 03:07
-
تکرار روی پستها با حلقه for سنتی 01:32
-
آشنایی با کتابخانه ReactJS برای فرانتاند 02:55
-
ایجاد پروژه با Create React App 02:22
-
مشاهده صفحه منبع اپلیکیشن تکصفحهای (SPA) 03:48
-
بررسی فایلهای کد منبع پروژه ریاکت 04:16
-
کنجکاوی درباره تبدیل JSX با Babel 01:49
-
نام کلاس و ایمپورت فایل CSS 03:32
-
تبدیل صفحه ساده HTML به کامپوننت ریاکت 05:38
-
ایجاد کامپوننت ریاکت برای ریست پسورد 04:01
-
انتقال کامپوننت سفارشی به فایل جداگانه 04:05
-
نصب React Router DOM با NPM 00:58
-
اجرای جاوااسکریپت خارج از مرورگر با نودجیاس 00:47
-
فایلهای جیسان پکیج NPM و ماژولهای Node 03:12
-
اتصال Router Provider و تعریف مسیر 04:57
-
افزودن مسیر برای ریست پسورد 02:44
-
انتقال تعریف مسیرها به فایل جداگانه 01:40
-
مسیر برای طرحبندی با محتوای جایبان 03:02
-
افزودن هدر و فوتر مشترک به همه صفحات 01:06
-
تبدیل صفحه پیامهای HTML به کامپوننت ریاکت 07:35
-
تغییر برچسب Attribute به htmlFor Prop 00:53
-
افزودن تابع هندلر ارسال فرم پیام 02:53
-
ایمپورت CSS و نقشه برای تولید پویای Divs 04:26
-
هوک useState برای ذخیره و تنظیم پستها 02:20
-
هوک useEffect برای دریافت و بارگذاری پستها 06:09
-
کنترل مقدار textarea و رویداد onChange 04:11
-
ارسال کامنت جدید به روش ریکت 04:02
-
خلاصهای از روش ریاکت 02:18
-
آشنایی با زبان کوئری ساختاریافته (SQL) 02:41
-
انتخاب ستونها از جدول 04:30
-
حذف داپلیکیتها با Distinct 02:57
-
فیلتر سطرها با Where 04:50
-
درج مقادیر در جدول 05:55
-
حذف رکورد از جدول 01:56
-
بروزرسانی مقدار ستون در جدول 01:01
-
ترکیب جداول با INNER JOIN 05:11
-
جوینهای SQL در نمودار ون 01:19
-
شمارش سطرها و Alias نام ستون 01:29
-
ایجاد جدول ماشینها 03:11
-
PostgreSQL و انواع مختلف SQL 01:25
-
کاری که میخواهیم انجام دهیم؟ 01:17
-
رجیستر سرور در pgAdmin 01:15
-
ایجاد نقش کاربر با استفاده از pgAdmin 01:16
-
چگونه PSQL و ابزار کوئری را در pgAdmin باز کنیم؟ 01:58
-
ایجاد پایگاه داده با استفاده از pgAdmin 01:16
-
ایجاد پیامهای جدول با استفاده از pgAdmin 05:52
-
بررسی ویژگیها در pgAdmin 01:13
-
استفاده از PSQL برای انتخاب و درج رکوردها 04:11
-
انتخاب سطرها از جدول با ابزار کوئری 01:58
-
بررسی فرم فرانتاند برای طراحی جدول جدید 01:58
-
ایجاد کاربران جدول با استفاده از pgAdmin 06:17
-
نکتهای درباره تغییر پایگاه داده 01:04
-
درباره مدیریت ارسال فرم ثبتنام در بکاند 03:01
-
استفاده از اسکریپتهای pgAdmin برای نوشتن کوئریها 02:37
-
چند نکته در PSQL مانند نمایش توسعه یافته 02:12
-
نودجیاس چیست؟ 01:19
-
راهاندازی پروژه سرور و نصب Express 02:27
-
وب سرور HTTP چیست؟ 01:58
-
ایجاد اپلیکیشن Express و تعریف اندپوینت GET 08:31
-
ابزارهای توسعه مرورگر برای تحلیل درخواست HTTP GET 02:36
-
بررسی بخشهای سیستم 03:53
-
نصب پکیج NPM به نام pg 03:14
-
قدرتبخشی به سرور با کنسول لاگ 03:45
-
نمونه جدید کلاینت PG 06:52
-
جلوگیری از قرار دادن Secrets در کنترل نسخه با Env و JSON 05:24
-
Nodemon برای ری استارت خودکار سرور در حین توسعه 03:26
-
استفاده از کلاینت PG برای کوئری جدول پیامها 03:28
-
بازبینی اپلیکیشن فرانتاند ریاکت 04:37
-
توضیح نقشه آرایه با استفاده از Node REPL 01:48
-
برخورد با مشکل CORS 02:04
-
نصب cors با NPM و توضیح میانافزار 02:47
-
استفاده از cors در اپلیکیشن و فیکس کردن هشدار کلید Prop 02:31
-
بررسی پاسخ با نقاط شکست دیباگر 01:56
-
بروزرسانی فرانتاند برای ارسال پیام به بکاند ما 05:56
-
اندپوینت POST و پیامها برای درج داده 08:06
-
کنوانسیون نامگذاری در REST 04:08
-
بررسی اپلیکیشنهای موبایل 02:03
-
الزامات توسعه موبایل با React Native 00:38
-
ایجاد پروژه با Create Expo App 01:23
-
راهاندازی سرور توسعه Expo 02:35
-
ویژگی Style و StyleSheet 04:43
-
تعریف استایلها در فایل جداگانه 02:18
-
مستندات مرجع برای یادگیری کامپوننتها 00:34
-
نمایش متن هنگام فشردن دکمه با استفاده از React State 04:07
-
نمایش تصویر از URI 01:55
-
کامپوننت ورودی متن و مقداری Flexbox 04:25
-
Padding Top برای جلوگیری از همپوشانی با نوار وضعیت 00:37
-
ثابتهای ارتفاع نوار وضعیت 01:05
-
نصب React Navigation 02:05
-
راهاندازی Stack Navigator 04:06
-
انتقال کامپوننت صفحه نمایش به فایل جداگانه 03:30
-
افزودن صفحه نمایش جدید و تعریف صفحه نمایش اولیه 03:14
-
ناوبری برنامهای از صفحه اصلی به پیامها 02:14
-
نکتهای درباره اجرای شبیهساز بدون گوشی 00:46
-
مثال Secrets فایل جیسان 03:03
-
واکشی پیامها و ضبط خطا 05:39
-
استفاده از localtunnel برای دسترسی گوشی به سرور بکاند 03:06
-
بهبود برخی استایلها برای صفحه نمایش پیامها 02:41
-
TextInput با آرایه از استایلها 02:26
-
افزودن دکمه کامنت 05:41
-
ScrollView برای اسکرول صفحه نمایش 02:40
مشخصات آموزش
توسعه وب فول استک با جاوااسکریپت و PostgreSQL
- تاریخ به روز رسانی: 1404/12/10
- سطح دوره:مقدماتی
- تعداد درس:209
- مدت زمان :10:34:32
- حجم :5.49GB
- زبان:دوبله زبان فارسی
- دوره آموزشی:AI Academy