مطالب پیشنهادی از سراسر وب

دوره کامل توسعه وب 2020 - ساخت 15 پروژه

دسته بندی ها: آموزش های ویژه ، آموزش طراحی وب ، آموزش های یودمی (Udemy) ، آموزش نود جی اس (Node.js) ، آموزش اچ تی ام ال (HTML) ، آموزش پی اچ پی (PHP)

تنها دوره ای که برای تبدیل شدن به یک توسعه دهنده وب full-stack به آن نیاز دارید. این دوره HTML5 ،CSS3 ،JS ،ES6 ،Node ،API، تلفن همراه و موارد دیگر را پوشش می دهد!

آخرین آپدیت: 2020-5

آنچه یاد خواهید گرفت:

  • با استفاده از جدیدترین فناوری های وب 2020، از مهارت های سطح صفر در ساخت برنامه های قدرتمند وب به سطح کاملاً حرفه ای بروید.
  • از نمونه کارهایی با بیش از 15 وب سایت، بازی و برنامه موبایل بسیار حرفه ای که در طول دوره ایجاد کرده اید استفاده کنید تا حرفه خود را به سطح بالاتری برسانید.
  • برنامه های تلفن همراه واقعی ایجاد کنید و آنها را در فروشگاه App IOS و Google Play بارگذاری کنید.
  • برای ساختن محتوای وب سایت و افزودن استایل و ظاهر خیره کننده از HTML5 ،CSS3 ،Flexbox ،Grid & SASS استفاده کنید.
  • برای ایجاد وب سایت ها و بازی های تعاملی از رابط کاربری Javascript ، jQuery و jQuery استفاده کنید.
  • از Twitter Bootstrap برای تولید وب سایت های واکنشگرا استفاده کنید که با هر اندازه دستگاهی سازگار هستند.
  • برای ساخت وب سایت های مبتنی بر پایگاه داده پویا از فناوری های Back End مانندNodeJS ،PHP ،AJAX ،JSON استفاده کنید.
  • از مهارت های پیشرفته برای اتصال وب سایت های خود به API مانند Google Maps ،Facebook ،Google Plus و Twitter استفاده کنید.
  • با استفاده از HTML5 و CSS3 یک وب سایت آموزش ریاضی حرفه ای ایجاد کنید.
  • با استفاده از HTML5 ،CSS3 و JavaScript یک بازی ریاضی حرفه ای ایجاد کنید.
  • با استفاده از HTML5 ،CSS3 و JQuery یک بازی Professional Fruits Slice ایجاد کنید.
  • با استفاده از HTML5 ،CSS3 و Bootstrap یک صفحه فرود حرفه ای اپلیکیشن ایجاد کنید.
  • با استفاده از HTML5 ،CSS3 و Bootstrap یک وب سایت شرکت حرفه ای ایجاد کنید
  • با استفاده از HTML5 ،CSS3 ،jQuery و Bootstrap یک وب سایت حرفه ای با پس زمینه ویدئو ایجاد کنید.
  • با استفاده از HTML5 ،CSS3 ،jQuery و Bootstrap یک برنامه کرونومتر حرفه ای ایجاد کنید.
  • با استفاده از HTML5 ،CSS3 ، jQuery UI ، Canvas ،Local Storage ... یک برنامه طراحی حرفه ای ایجاد کنید.
  • با استفاده از ES6 ،NodeJS ،HTML5 ،CSS3 و Bootstrap یک برنامه حرفه ای Online File Explorer ایجاد کنید.
  • با استفاده از HTML5 ،CSS3 ،Bootstrap ،PHP ،MySQL و AJAX یک برنامه حرفه ای یادداشت آنلاین ایجاد کنید.
  • با استفاده از وردپرس یک وبلاگ حرفه ای ایجاد کنید.
  • با استفاده از HTML5 ،CSS3 ، jQuery و Google Maps API یک برنامه حرفه ای فاصله بین شهرها را ایجاد کنید.
  • با ابزارک های اجتماعی (Facebook ،+Google و Twitter) یک وب سایت حرفه ای ایجاد کنید.
  • یک برنامه Speed Reader حرفه ای برای IOS و Android ایجاد کنید.
  • یک برنامه کاملاً کاربردی برای به اشتراک گذاری اتومبیل ایجاد کنید که کاربران در سراسر جهان بتوانند از آن برای به اشتراک گذاشتن سفرهای اتومبیل استفاده کنند. (با استفاده از HTML5 ،CSS3 ، Javascript ،PHP ، MySQL ،AJAX و JSON)

الزامات

  • این دوره همه چیز را یاد خواهم داد. تمام آنچه شما نیاز دارید یک کامپیوتر است.
  • مطلقا هیچ دانش قبلی لازم نیست. این یک دوره وب 100٪ جامع است
  • دوره ای که توسعه وب شما را از مهارت های صفر به مهارت درآمدزا برساند
  • کسب درآمد از توسعه دهنده وب، گام به گام و بدون هیچ نکته از قلم افتاده ای است.

توضیحات

این دوره شامل (Flexbox، CSS Grid، SASS، Modern JS (ES6، گیت و گیتهاب، Node.js (شامل پروژه کامل)، Heroku و غیره می گردد.

در این دوره شما بر روی بیش از 10 تکنولوژی 2020 مدرن مسلط می شوید:

  1. HTML5/CSS3
  2. (JAVASCRIPT (ES5
  3. (Modern JavaScript (ES6
  4. JQUERY و JQUERY UI
  5. TWITTER BOOTSTRAP
  6. Node.js
  7. Git و Github
  8. Heroku
  9. PHP و MYSQL
  10. وردپرس
  11. AJAX
  12. JSON
  13. اپلیکیشن های موبایل
  14. GOOGLE MAPS APIS
  15. ویدجت های فیسبوک
  16. ویدجت های گوگل پلاس
  17. ویدجت های توییتر
  18. و غیره

به کمک این دوره می توانید از یک فرد مبتدی بدون مهارت به فرد حرفه ای تبدیل شوید که می تواند از این مبحث درآمد کسب کند. اگر به دنبال دوره ی 100% جامع و کامل توسعه وب می گردید که تمام مباحث را از ابتدا تا آخر پوشش دهد شما در مکان درستی قرار گرفته اید.

گذراندن این دوره به شما در رسیدن به رویای خود مبنی بر تبدیل شدن به یک توسعه دهنده حرفه ای وب کمک می کند، و شما آماده خواهید بود که با استفاده از پیشرفته ترین و به روزترین فن آوری های وب در عرض چند هفته، وب سایت های قدرتمند و واکنشگرا را در سطح حرفه ای بسازید. به منظور تضمین موفقیت در یادگیری شما، این دوره به بخش های متشکل از 100 ساعت آموزش شفاف و 100٪ جذاب تقسیم شد. هر فصل یکی از اصلی ترین فناوری های وب را در بر می گیرد و شما را از اصول اولیه تا مهارت های پیشرفته یاری می رساند. 

ابتدا مفاهیم اساسی و پایه را فرا خواهید گرفت، و بلافاصله، آنها را در مثال های عملی ساده به کار می گیرید. سپس به راحتی به مفاهیم پیشرفته تری می روید و از آنها برای ساختن برنامه های پیچیده تر استفاده می کنید. هنگامی که فصل را به پایان رساندید، به یک چالش بزرگتر می روید که در آنجا با اطمینان "یک پروژه حرفه ای کاملا واقعی" را با استفاده از مهارت هایی که در آن فصل با مهارت های قبلی به دست آورده اید، ایجاد خواهید کرد.

در اینجا چند نمونه از فعالیت های درون فصل را برایتان لیست کرده ایم:

  • یک ویدیوی YouTube آرامش بخش را در وب سایت خود قرار دهید (HTML)
  • فرم پرداخت آنلاین (HTML) ایجاد کنید
  • کنترل سرعت بزرگراه (HTML و JavaScript)
  • انتخاب کنندگان تاریخ پرواز خروجی و برگشتی دقیقاً مانند وب سایت Expedia (HTML ،CSS ،jQuery و jQuery UI)
  • محدوده مسافت پیموده شده اتومبیل با استفاده از یک اسلایدر زیبا (HTML ،CSS ،jQuery و jQuery UI)
  • اسلایدر چرخ فلک تعاملی (HTML ،CSS ،jQuery و بوت استرپ)
  • ایجاد فرم تماس واکنشگرا (HTML ،CSS ،PHP و بوت استرپ)
  • چه روزی از هفته به دنیا آمدید؟ (HTML و PHP)
  • تاریخ را در 1000 روز دیگر حدس بزنید! (HTML و PHP)
  • مسیر، فاصله و زمان بین نیویورک و تورنتو را محاسبه کنید. (HTML ،Javascript ،Google Maps API)
  • مختصات جغرافیایی و کد پستی هر آدرس را دریافت کنید. (HTML ، jQuery ،Google Maps API ، JSON)

در زیر برخی از "پروژه های کامل حرفه ای" است که در طول دوره ایجاد خواهید کرد:

  • وب سایت آموزش ریاضیات. (HTML5 و CSS3)
  • بازی ریاضیات. (HTML5 ،CSS3 و JavaScript)
  • بازی Fruits Slice Game با HTML5 ،CSS3 و jQuery
  • صفحه فرود برنامه. (HTML5 ،CSS3 و بوت استرپ)
  • وب سایت شرکت (HTML5 ،CSS3 و بوت استرپ)
  • برنامه کرنومتر (HTML5 ،CSS3 ،jQuery و بوت استرپ)
  • برنامه طراحی (HTML5 ،CSS3 ، jQuery و jQuery UI ،Canvas ،HTML5 Local Storage)
  • برنامه آنلاین فایل اکسپلورر (Node.js ،ES6 ،HTML5 ،CSS3، بوت استرپ)
  • برنامه یادداشت های آنلاین. (HTML5 ،CSS3 ، jQuery ،Bootstrap ،PHP و MySQL) (پروژه کامل 11 ساعته)
  • وبلاگ بسیار حرفه ای (وردپرس)
  • وب سایت فاصله بین شهرها. (HTML5 و CSS3 ، jQuery ،Google Maps)
  • وب سایت آزادی با ابزارک های اجتماعی. (فیس بوک ، Google+ و توییتر)
  • برنامه Speed Reader برای فروشگاه های IOS و Google Play.
  • وب سایت کاملاً کاربردی اشتراک گذاری اتومبیل. (HTML5 ،CSS3 ،jQuery ،Bootstrap ،PHP و MySQL ،Ajax  JSON ،Google Maps) (پروژه کامل 10 ساعته)

شما از کار درجه یک خود بسیار شگفت زده خواهید شد و مطمئنا دوست دارید آن را با دنیا به اشتراک بگذارید. در نتیجه می توانید از هفته اول سفر بی نظیر خود درآمدزایی کنید. در پایان دوره، شما مجموعه ای جامع از "بیش از 15 وب سایت، بازی و برنامه موبایل واقعی حرفه ای برای فروشگاه های IOS و Google" ایجاد خواهید کرد. این به شما یک رقابتی در بازار توسعه وب می دهد و با افزایش اشتغالزایی یا شانس اعطای پروژه های سودآور توسط مشتریان در سراسر جهان، درآمد شما را به عنوان یک توسعه دهنده وب افزایش می دهد.

این دوره برای چه کسی مناسب است؟

  • برای افرادی است که هیچ دانش و تجربه توسعه وب ندارند.
  • همچنین برای افرادی است که دانش توسعه وب دارند ، اما مایل به یادگیری مهارت های جدید و غنی سازی نمونه کارها با 15 وب سایت، بازی و برنامه موبایل بسیار حرفه ای تعاملی هستند.

مباحث دوره:

  • مقدمه - اولین Web Hosting نامحدود خود را دریافت کنید - HTML
  • CSS
  • پروژه حرفه ای: وب سایت آموزش ریاضیات (HTML5 و CSS3)
  • CSS پیشرفته با Flexbox ،Grid و SASS
  • جاوااسکریپت
  • پروژه حرفه ای: بازی ریاضی (HTML ،CSS و JavaScript)
  • جی کوئری
  • پروژه حرفه ای: بازی Fruits Slice (جی کوئری، HTML5 و CSS)
  • Twitter Bootstrap
  • پروژه حرفه ای: صفحه فرود اپلیکشن (HTML ،CSS و بوت استرپ)
  • پروژه حرفه ای: وب سایت شرکتی (HTML ،CSS و بوت استرپ)
  • پروژه حرفه ای: دوره دوست داشتنی ما (HTML ،CSS، جی کوئری و بوت استرپ)
  • پروژه حرفه ای: اپلیکیشن Stopwatch (جی کوئری، بوت استرپ، HTML و CSS)
  • پروژه حرفه ای: اپلیکیشن طراحی (HTML ،CSS ، jQuery UI ،Canvas ،Local Storage)
  • ES6  - جاوااسکریپت مدرن (یک الزام در 2019)
  • Front End در مقابل Back End
  • Node.js - مقدمه و نصب
  • دوره خیلی مهم خط فرمان
  • Node.js - درک عمیق تر (استفاده از ES6 + ES7)
  • پروژه حرفه ای: اپلیکیشن Online File Explorer (بوت استرپ 4 و Node.js خالص)
  • گیت و گیتهاب
  • استقرار اپلیکیشن در Heroku
  • PHP
  • MySQL
  • پروژه حرفه ای: اپلیکیشن Online Notes - (بوت استرپ، HTML ،CSS ،PHP ،MySQL ،AJAX)
  • وردپرس (3 صفحه وب حرفه ای - بلاگ + صفحه درباره ما + صفحه تماس با ما)
  • Google Maps API's
  • پروژه حرفه ای: فاصله بین شهرها (HTML. CSS ، jQuery، گوگل مپ)
  • پروژه حرفه ای: وبسایت با ویدجت های اجتماعی (فیسبوک، گوگل پلاس و توییتر)
  • اپلیکیشن های موبایل IOS و Android با jQuery Mobile
  • پروژه حرفه ای: Speed Reader برای IOS و Android
  • پروژه حرفه ای: وبسایت اشتراک گذاری ماشین (جاوااسکریپت، PHP ،MySQL ، AJAX ،JSON)
  • مطالعات بیشتر

سایر ویدئوهای دوره:

ساختار وبسایت

 

اولین وبسایت شما

 

دریافت اولین Web Hosting نامحدود 

آیا این نوشته را دوست داشتید؟
Udemy - The Complete 2020 Web Development Course - Build 15 Projects Publisher:Udemy Author:Development Island (UK) Duration:90 hours Level:Beginner to Advanced

The only course you need to become a full-stack web developer. Covers HTML5, CSS3, JS, ES6, Node, APIs, Mobile & more!

Last Update: 2020-5

What you'll learn

  • Go from Zero skills to building Powerful Web Applications on a highly professional level using the latest 2020 Web Technologies.
  • Use a Portfolio of over 15 highly professional websites, Games and Mobile apps you would have developed during the course to take your career to the next level.
  • Create real life mobile apps and upload them to the IOS App Store and Google Play.
  • Use HTML5, CSS3, Flexbox, Grid & SASS to build website content and add stunning styling and decoration.
  • Use Javascript, jQuery & jQuery User Interface to create Interactive Websites and Games.
  • Use Twitter Bootstrap to produce Responsive Websites that will adapt to any device size.
  • Use Back End Technologies like NodeJS, PHP, AJAX, JSON to build dynamic database-driven websites.
  • Use advanced skills to connect your websites to APIs like Google Maps, Facebook, Google plus and Twitter.
  • Create a Professional Mathematics Tutorial Website using HTML5 & CSS3.
  • Create a Professional Maths Game using HTML5, CSS3 & JavaScript.
  • Create a Professional Fruits Slice Game using HTML5, CSS3 & JQuery.
  • Create a Professional App Landing Page using HTML5, CSS3 & Bootstrap.
  • Create a Professional Company Website using HTML5, CSS3 & Bootstrap
  • Create a Professional website with video background using HTML5, CSS3, jQuery & Bootstrap.
  • Create a Professional Stopwatch App using HTML5, CSS3, jQuery & Bootstrap.
  • Create a Professional Drawing App using HTML5, CSS3, jQuery UI, Canvas, Local Storage...
  • Create a Professional Online File Explorer App using ES6, NodeJS , HTML5, CSS3 & Bootstrap.
  • Create a Professional Online Notes App using HTML5, CSS3, Bootstrap, PHP, MySQL & AJAX.
  • Create a Professional Blog using WordPress.
  • Create a Professional Distance Between Cities App using HTML5, CSS3, jQuery, & Google Maps APIs.
  • Create a Professional Website with Social Widgets (Facebook, Google+ & Twitter).
  • Create a Professional Speed Reader App for IOS and Android.
  • Create a Fully Functional Car Sharing App which users around the world can use to share car trips. (using HTML5, CSS3, Javascript, PHP, MySQL, AJAX & JSON)

Requirements

  • I will teach you everything. All you need is a computer.
  • There is absolutely no pre-knowledge required. This is a 100% Comprehensive Web
  • Development Course that will take you from Zero-skills to a Cash Earning Web Developer, Step by Step with NO Step skipped.

Description

Recent Update:

Includes Flexbox, CSS Grid, SASS, Modern JS (ES6), Node.js (full project included), Git & Github, Heroku & more.

***** Save ~ $17000 compared to an in-person Bootcamp *****

***** 15 Full Professional Projects worth over 20,000$ *****

***** This is The Only Course you need to learn Web Development *****

***** Car Sharing Website (10h), Online Notes App (11h) & many more *****

***** 100 hours of Content + 40 hands on Activities + 21 Quizzes *****

***** Learn Step by Step with NO Step Skipped *****

***** The Most Comprehensive and Cost Effective in the Market *****

 

***** Learn and Master Over 10 Modern 2020 Technologies *****

  • HTML5/CSS3
  • JAVASCRIPT (ES5)
  • Modern JavaScript (ES6)
  • JQUERY & JQUERY UI
  • TWITTER BOOTSTRAP
  • Node.js
  • Git & Github
  • Heroku
  • PHP & MYSQL
  • WORDPRESS
  • AJAX
  • JSON
  • MOBILE APPS
  • GOOGLE MAPS APIS
  • FACEBOOK WIDGETS
  • GOOGLE PLUS WIDGETS
  • TWITTER WIDGETS
  • AND MORE!

Did you know you can go from Zero Skills to a Fully Qualified Cash Earning Web Developer in only a few weeks?

Well let me tell you: If you are looking for a truly 100% Comprehensive Web Development Course, that will take you from learning the basics to mastering the most advanced web development techniques, then be certain that you have come to the right place.

Taking this course will help you achieve your dream of becoming a professional web developer, and you will be ready to build powerful and responsive websites to a highly professional degree using today’s most advanced and up to date web technologies within a few weeks from now.

In order to guarantee the success of your learning experience, this course was divided into perfectly structured Chapters consisting of ~100 hours of crystal clear and 100% hands-on engaging lectures.

Each chapter covers one of the major web technologies and will take you from the basics to advanced skills. This is how:

You will first learn the basic concepts, and straight after that apply them in easy practical examples. Then you will easily navigate to more advanced concepts and use them to build more complex applications. Once you have finished the chapter, you will then move to a bigger challenge where you will confidently build a “Real Life Full Professional Project” using the skills you acquired in that chapter combined with previous ones.

Here are a few examples of in-chapter activities:

  • Embed a relaxing YouTube Video to your website (HTML)
  • Create an online checkout form (HTML)
  • Highway Speed Control (HTML & JavaScript)
  • Outbound and Return Flight date pickers just like the Expedia Website (HTML, CSS, jQuery & jQuery UI)
  • Car Mileage range using a beautiful slider (HTML, CSS, jQuery & jQuery UI)
  • Interactive carousel slider (HTML, CSS, jQuery & Bootstrap)
  • Create a responsive Contact Form (HTML, CSS, PHP & Bootstrap)
  • What day of the week were you born? (HTML & PHP)
  • Guess the date in 1000 days from now! (HTML & PHP)
  • Calculate the route, distance and time between New York and Toronto. (HTML, Javascript, Google Maps API’s)
  • Get the geographic coordinates and postcode of any address. (HTML, jQuery, Google Maps API’s, JSON)
  • And much more …

Following are some of the “FULL PROFESSIONAL PROJECTS” you will build throughout the course:

  • Mathematics Tutorials Website. (HTML5 & CSS3)
  • Maths Game. (HTML5, CSS3 & JavaScript)
  • Fruits Slice Game. (HTML5, CSS3 & jQuery)
  • App Landing Page. (HTML5, CSS3 & Bootstrap)
  • Company Website. (HTML5, CSS3 & Bootstrap)
  • Stopwatch App. (HTML5, CSS3, jQuery & Bootstrap)
  • Drawing App. (HTML5, CSS3, jQuery & jQuery UI, Canvas, HTML5 Local Storage)
  • Online File Explorer App. (Node.js, ES6, HTML5, CSS3, Bootstrap)
  • Online Notes App. (HTML5, CSS3, jQuery, Bootstrap, PHP & MySQL) (Full 11h project)
  • Highly professional Blog. (Wordpress)
  • Distance Between Cities Website. (HTML5. CSS3, jQuery, Google Maps)
  • Freedom Website with Social Widgets. (Facebook, Google+ & Twitter)
  • Speed Reader App for the IOS and Google Play Stores.
  • Fully functional Car Sharing Website. (HTML5, CSS3, jQuery, Bootstrap, PHP & MySQL, Ajax, JSON, Google Maps) (Full 10h project)

You will be so amazed at your own first-class work, and I am sure you will love to share it with the world. That’s why I will offer you "FREE WEB HOSTING" worth 200$ so that you can make your professional websites live and attract potential employers or clients. As a result you can start making money from the first week of your unique learning journey.

By the end of the course, you will have built a solid portfolio of “Over 15 Real Professional Websites, Games and Mobile Apps for The IOS and Google Stores”. This will give you a competitive edge in the web development market and boost your income as a web developer by increasing your employability or chances of being awarded lucrative projects by clients around the world.

 

Who this course is for:

  • This Course is for people with no web development knowledge or experience.
  • This Course is also for people with web development knowledge, but wanting to learn new skills and enrich their portfolio with 15 Highly professional Interactive Websites, Games and Mobile Apps.

Course content

  • Introduction - Get your free Unlimited Web Hosting - HTML
    • Syllabus Download
    • How a website works
    • Your journey inside the course
    • How to watch videos in HD resolution
    • How to get help
    • HTML Chapter: Roadmap and Full Source Code
    • Structure of a website
    • Your first website
    • Your passcode
    • Get your free unlimited web hosting
    • Important note about FTP
    • Share your website with the world (1)
    • Share your website with the world (2) - Cyberduck version
    • Share your website with the world (2) - FileZilla Version
    • Headings
    • Paragraphs
    • Links
    • Images
    • Inline vs Block Elements
    • Iframes - Activity: Embed a nice relaxing YouTube video to your website
    • Unordered Lists
    • Ordered Lists
    • Description Lists
    • Tables
    • Entities
    • Forms (1) - Activity: Create a simple Login Form
    • Forms (2) - Activity: Create a Marketplace Checkout Form
    • Text Decoration
    • Comments
    • HTML Quiz
  • CSS
    • Introduction
    • CSS Chapter: Roadmap and Full Source Code
    • Inline CSS
    • Internal CSS
    • External CSS
    • Classes and IDs
    • Div and Span
    • Box Model
    • Box Model: Padding
    • Box Model: Border
    • Box Model: Outline
    • Box Model: Margin
    • Background
    • Floating
    • Positioning
    • Display
    • Text Decoration
    • Text Align
    • Text Font
    • Text Effects
    • Image Sprites
    • Image Opacity
    • Styling Lists
    • Styling Links
    • Gradients
    • 2D Transforms
    • 3D Transforms
    • Transitions
    • Animations
    • CSS3 Quiz
  • Professional Project: Mathematics Tutorials Website (HTML5 & CSS3)
    • Project Introduction: Mathematics Tutorials Website (HTML & CSS)
    • Header (1)
    • Header (2)
    • Menu
    • Introduction Box
    • Sidebars (1)
    • Sidebars (2)
    • Footer & Congratulations
    • Mathematics Tutorial Website Quiz
    • Maths Website Source Code
  • Advanced CSS with Flexbox, Grid & SASS
    • Flexbox: Introduction
    • Flexbox: Basic Flexbox
    • Flexbox: Align flex items
    • Flexbox: Align flex lines
    • Flexbox: Resize flex items (1)
    • Flexbox: Resize flex items (2)
    • Flexbox Application: Photo Gallery (1)
    • Flexbox Application: Photo Gallery (2)
    • Flexbox Application: Amazon Checkout (1)
    • Flexbox Application: Amazon Checkout (2)
    • Flexbox Application: Amazon Checkout (3)
    • Flexbox Application: Maths Website (1)
    • Flexbox Application: Maths Website (2)
    • Flexbox Application: Maths Website (3)
    • CSS Grid: Introduction & Basic Grid Template
    • CSS Grid: Implicit vs Explicit Grid
    • CSS Grid: Grid areas & Responsive design
    • CSS Grid: Master the "grid-column" property
    • CSS Grid: Grid Coordinates
    • CSS Grid: Align Grid items
    • CSS Grid Application: Photo Gallery
    • CSS Grid Application: Picture Grid
    • Sass: Introduction - Installation - Nesting Syntax
    • Sass: .scss vs .sass - Variables
    • Sass: @import & @extend directives
    • Sass: Mixins - Operators - Functions
  • Javascript
    • Introduction
    • JavaScript Chapter: Roadmap and Full Source Code
    • Buttons
    • Change HTML Content
    • Change HTML Style
    • Variables and Data Types
    • Change HTML Using Variables - Activity: Random Color Generator
    • Functions: Activity: Swap the content of two divs
    • Objects
    • Create Objects using the "new" keyword
    • Object Contructors
    • Arrays
    • If and Switch Statements - Activity: Motorway Speed Control
    • For Loops
    • While Loops - Activity: Spend $1000 Randomly in a marketplace
    • Regular Expressions
    • Errors (1)
    • Errors (2) - Activity: Password Validation
    • Set Interval & SeTimeout - Activity: Create a simple counter
    • Window and Screen
    • Alert Boxes
    • Cookies
    • Javascript Quiz
  • Professional Project: Maths Game (HTML, CSS & JavaScript)
    • Project Introduction: Maths Game (HTML, CSS & JavaScript)
    • Page Structure & Styling (1)
    • Page Structure & Styling (2)
    • Page Structure & Styling (3)
    • Page Structure & Styling (4)
    • Game Logic using an illustrative flowchart
    • JavaScript Code (1)
    • JavaScript Code (2)
    • JavaScript Code (3)
    • JavaScript Code (4) & Congratulations
    • Maths Game Quiz
    • Math Game Source Code
  • jQuery
    • Introduction and Loading JQuery
    • JQuery Chapter: Roadmap and Full Source Code
    • Select HTML Elements (1)
    • Select HTML Elements (2)
    • Respond to Events
    • Change HTML Content and Attributes (1)
    • Change HTML Content and Attributes (2)
    • Change Styling (1)
    • Change Styling (2) - Activity: Random Position and Color Generator
    • JQuery Effects
    • Ajax
    • JQuery UI Introduction
    • Draggable and Droppable (1) - Activity: Leave me alone! Please drop me!
    • Draggable and Droppable (2) - Activity: Drag Items to your basket
    • Resizable
    • Selectable - Activity: Append selected Car Makes to a Box
    • Sortable - Activity: Sort and exchange Car Makes between two groups
    • Accordion - Activity: Create a resizable accordion with collapsible sections
    • Autocomplete - Activity: City Input with prepopulated options
    • Button
    • Date Picker - Activity: Outbound and return Flight Date Picker just like Expedia
    • Dialog - Activity: Are you sure you want to go to the previous page?
    • Menu
    • Progress Bar - Activity: Animated progress bar filled from 0% to 100%
    • Select Menu
    • Slider - Activity: Car Mileage Range using a Slider
    • More Widgets: Spinners, Tabs and Tooltips
    • jQuery Quiz
  • Professional Project: Fruits Slice Game (HTML, CSS & JQuery)
    • Project Introduction: Fruits Slice Game (HTML, CSS & JQuery)
    • Page Structure and Styling
    • Game Logic using an illustrative flowchart
    • jQuery Code (1)
    • jQuery Code (2)
    • jQuery Code (3)
    • jQuery Code (4)
    • Fruits Slice Game Quiz
    • Fruits Slice Game Source Code
  • Twitter Bootstrap
    • Introduction
    • Bootstrap Chapter: Roadmap and Full Source Code
    • Grid System
    • Typography
    • Tables
    • Forms (1) - Activity: Inline and Horizontal Responsive Login Forms
    • Forms (2)
    • Forms (3)
    • Buttons
    • Images
    • Navs - Activity: Website Design using Nav Tabs and Nav Pills
    • Navbars - Activity: Website Design using a responsive/collapsible navigation bar
    • Pagination - Activity: Pagination and Pager Examples like Google/Ebay
    • Jumbotron
    • Thumbnails
    • Dropdown menus
    • Modals (1) - Activity: I have an inquiry about my order
    • Modals (2) - Activity: I have an inquiry about my order
    • Scrollspy
    • Tabs
    • Tooltips
    • Popovers - Activity: Create a popover just like the one you see on an IPAD
    • Alerts - Activity: Create an alert Box to show a warning or success message
    • Button plugin - Activity: Loading … Download Complete
    • Collapse plugin
    • Carousels - Activity: Create an interactive carousel slider
    • Affix plugin - Activity: Interactive Website with Content Affixed to a Menu
    • Twitter Bootstrap Quiz
  • Professional Project: App Landing Page (HTML, CSS & Bootstrap)
    • Project Introduction: App Landing Page (HTML, CSS & Bootstrap)
    • Header and Featured Content (1)
    • Header and Featured Content (2)
    • Header and Featured Content (3)
    • Trial Section, Footer & Congratulations
    • App Landing Page Quiz
    • App Landing Page Source Code
  • Professional Project: Company Website (HTML, CSS & Bootstrap)
    • Project Introduction: Company Website (HTML, CSS & Bootstrap)
    • Structure of our work
    • Background
    • Navbar
    • Header & icons section
    • Contact Button & Footer
    • Company Website Quiz
    • Company Website Source Code
  • Professional Project: Our Lovely Course (HTML, CSS, jQuery & Bootstrap)
    • Project Introduction: Our Lovely Course (HTML, CSS, jQuery & Bootstrap)
    • Structure of our work
    • Add a background video
    • Navigation bar with advanced styling
    • Home Section
    • About Section
    • Carousel Slider (1)
    • Carousel Slider (2)
    • Adapt for Small Devices
    • Add ScrollSpy feature to navbar & Congratulations
    • Our Lovely Course Website Quiz
    • Our Lovely Course Website Source Code
  • Professional Project: Stopwatch App (HTML, CSS, jQuery & Bootstrap)
    • Project Introduction: Stopwatch App (HTML, CSS, jQuery & Bootstrap)
    • App Skeleton and Decoration (1)
    • App Skeleton and Decoration (2)
    • App Logic using an illustrative flowchart
    • jQuery Code (1)
    • jQuery Code (2)
    • jQuery Code (3)
    • StopWatch App Quiz
    • StopWatch App Source Code
  • Professional Project: Drawing App (HTML, CSS, jQuery UI, Canvas, Local Storage)
    • Project Introduction: Drawing App (HTML, CSS, jQuery UI, Canvas, Local Storage)
    • App Skeleton and Decoration (1)
    • App Skeleton and Decoration (2)
    • App Skeleton and Decoration (3)
    • Learn HTML5 Canvas
    • App Logic using an illustrative flowchart
    • jQuery Code Structure
    • jQuery Code (1)
    • jQuery Code (2)
    • jQuery Code (3)
    • Drawing App Quiz
    • Drawing App Source Code
  • ES6 - Modern JavaScript (A must in 2019)
    • Download Chapter Source Code
    • Introduction to Modern JavaScript (ES6)
    • Variables & Scoping: Review of "var"
    • Variables & Scoping: Let Scope and Temporal Dead Zone
    • Block Scoping in ES6
    • Functions and Block Scoping
    • Functions and Block Scoping – use let
    • Let Scope vs Closures
    • Closures Challenge
    • Read only variables - const
    • New Features that make your life easier: Template Literals
    • New Features that make your life easier: Arrow functions – ‘this’ lexical scope
    • Destructuring - Arrays
    • Destructuring - Objects
    • Destructuring - Functions
    • Functions – Default Parameter Values
    • Functions – Rest Parameters
    • Spread Operator
    • Objects New Features
    • Iteration: For of loop
    • Iterators - next() - Generators
    • Maps - Iteration
    • Sets - Iteration
    • Sets – Challenge: Intersection and Difference
    • Symbols
    • Symbol.iterator
    • Array.from: collections, strings, arguments
    • Array.from: optional map, length property, Maps & Sets
    • Array.of
    • More Array Methods
    • ES6 Classes: Back to ES5 Constructors
    • ES6 Classes: Syntax
    • ES6 Classes: Static Methods
    • ES6 Classes: Getters & Setters
    • Class Inheritance – extends - super
  • "Front End" vs "Back End"
    • Understand the Back End (1)
    • Understand the Back End (2)
  • Node.js - Introduction & Installation
    • Introduction to Node.js
    • How to run Unix commands on Windows
    • Node.js Installation + REPL (Read-Eval-Print-Loop)
  • The "super" Command Line Crash Course
    • Command Line Crash Course (1)
    • Command Line Crash Course (2)
    • Command Line Crash Course (3)
    • Command Line Crash Course (4)
  • Node.js - Let's Dive in (using ES6 + ES7)
    • Download Chapter Source Code
    • Your First Node Application
    • File Exports
    • HTTP Built-in Module (1)
    • HTTP Built-in Module (2)
    • HTTP Built-in Module (3)
    • Fs Built-in Module - Blocking Mode
    • Fs Built-in Module - Non Blocking Mode
    • Fs Built-in Module - Use ES6 Promises
    • Fs Built-in Module - Use ES7 Async Await
    • Fs Built-in Module - More Features
  • Professional Project: Online File Explorer App (Pure Node.js , Bootstrap 4)
    • Download Chapter Source Code (Mac, Linux, Windows)
    • Project Introduction: Online File Explorer App (Pure Node.js , Bootstrap 4)
    • Skeleton and Decoration
    • App Logic
    • Create the Server
    • Decode the path name and convert it to a full static path
    • Display folder content and print the title
    • Show the path inside a "Breadcrumb"
    • Loop through folder elements
    • Print Icons - Get introduced to the child_process module
    • Calculate folders' size using the child_process module
    • Convert folders' size to Bytes - Retrieve items' last modified time
    • Calculate the size of files
    • Get the mime type of files
    • Serve files to the Client
    • Serve PDF files on the browser - Serve Media content in chunks using a stream
    • Re-order folder elements by name
    • Re-order folder elements by name (2)
    • Add the up and down arrows after sorting elements by name
    • Sort elements by size and last modified
    • Fix projects bugs
  • Git & Github
    • Introduction to Version Control using Git
    • Your Git Identity
    • Git using the Command Line
    • Git Branching & Merging
    • Github - Introduction
    • Github - Cloning, Forking & Pull Requests (1)
    • Github - Cloning, Forking & Pull Requests (2)
    • Github - Cloning, Forking & Pull Requests (3)
  • Deploy your App to Heroku
    • Deploy your App to Heroku
  • PHP
    • Introduction
    • PHP Chapter: Roadmap and Full Source Code
    • Embed PHP in HTML
    • PHP Variables
    • Data Types: Strings
    • Data Types: Integers and Floats
    • Data Types: Booleans
    • Data Types: Arrays
    • Data Types: Objects
    • Data Types: NULL
    • Data Types: Resources
    • String Functions
    • If and Switch Statements
    • For Loops
    • While Loops
    • Functions
    • GET & POST
    • Array Functions (1)
    • Array Functions (2)
    • Send Emails – Activity: Send a styled email in HTML format
    • Filter User Inputs (1) – Protect Yourself from Hackers
    • Filter User Inputs (2) – User Input Validation
    • Activity: Create a responsive Contact Form using PHP & Bootstrap (1)
    • Activity: Create a responsive Contact Form using PHP & Bootstrap (2)
    • Activity: Create a responsive Contact Form using PHP & Bootstrap (3)
    • Date and Time (1)
    • Date and Time (2) - Activity: Day of the week you were born? Date in 1000 days?
    • Include PHP files
    • File Handling (1): Open – Read – Write - Close
    • File Handling (2): Open – Read – Write - Close
    • Upload Files Using PHP (1) – Activity: Upload PDF & Text Files Less than 3Mo.
    • Upload Files Using PHP (2) – Activity: Upload PDF & Text Files Less than 3Mo.
    • Cookies
    • Error Handling (1)
    • Error Handling (2) – Activity: Log PHP errors in a file / Trigger error emails
    • Sessions
    • PHP Quiz
  • MySQL
    • Introduction
    • MySQL Chapter: Roadmap and Full Source Code
    • Create a database using PHP MYADMIN
    • Remote MySQL (1)
    • Remote MySQL (2)
    • Create a database using PHP & MySQL
    • Add a table to a database
    • Populate a database table
    • Activity: Populate Database once the user submits a form
    • Activity: Populate Database once the user submits a form (2)
    • Activity: Populate an HTML table using Database Data (1)
    • Activity: Populate an HTML table using Database Data (2)
    • Update Database Data
    • Delete Database Data
    • MySQL Quiz
  • Professional Project: Online Notes App (HTML, CSS, Bootstrap, PHP, MySQL,AJAX)
    • Project Introduction: Online Notes App (HTML, CSS, Bootstrap, PHP, MySQL, AJAX)
    • App Skeleton and Decoration (1) - Landing Page
    • App Skeleton and Decoration (2) - Landing Page
    • App Skeleton and Decoration (3) - Landing Page
    • App Skeleton and Decoration (4) - Landing Page
    • App Skeleton and Decoration (5) - My Notes Page
    • App Skeleton and Decoration (6) - Profile Page
    • App Logic - Signup, Login, Remember Me, Forgot Password
    • Signup/Login Code Structure (1)
    • Signup/Login Code Structure (2)
    • Signup Code (1)
    • Signup Code (2)
    • Signup Code (3)
    • Signup Code (4)
    • Signup Code (5)
    • Login Code
    • "Remember me" Code (1)
    • "Remember me" Code (2)
    • "Remember me" Code (3) and Logout Code
    • "Forgot Password" Code (1)
    • "Forgot Password" Code (2)
    • "Forgot Password" Code (3)
    • "Forgot Password" Code (4)
    • Notes Management: Logic
    • Notes Management: Code Structure
    • Load Notes: Code (1)
    • Load Notes: Code (2)
    • Create Notes: Code (1)
    • Create Notes: Code (2)
    • Edit Notes: Code (1)
    • Edit Notes: Code (2)
    • Delete Notes: Code (1)
    • Delete Notes: Code (2)
    • Update Username Code (1)
    • Update Username Code (2)
    • Update Password Code (1)
    • Update Password Code (2)
    • Update Email Code (1)
    • Update Email Code (2)
  • WordPress (3 Professional Webpages: Blog + About Page + Contact Page)
    • Introduction
    • Installation – Activity: Create your first Blog
    • Blog Posts and Comments
    • Themes
    • Pages and Menus
    • Customise pages (1)
    • Customise pages (2)
    • Custom CSS
    • Plugins
    • Activity: Beautiful About Page (Add Content to a WordPress Page)
    • Activity: Beautiful About Page (Typography)
    • Activity: Beautiful About Page (Logos)
    • Activity: Beautiful About Page (Buttons)
    • Activity: Create an Awesome Contact Page with a Google Map and Contact Form
      WordPress Quiz
  • Google Maps API's
    • Introduction & Embed Google Map to your Website
    • Google Maps API's Chapter: Roadmap and Full Source Code
    • Markers and InfoWindows
    • Show, Hide or Delete Markers
    • Animated drop of Markers
    • Direction Service - Activity: Driving distance & time between New York & Toronto
    • Geocoding using the Javascript API - Activity: Get Geocoordinates of an address,
    • Geocoding using the geocoding API (1) - Activity: format Address & get postcode.
    • Geocoding using the geocoding API (2) - Activity: format Address & get postcode.
    • Nearby Search
    • Autocomplete
    • Google Maps API's Quiz
  • Professional Project: Distance Between Cities (HTML. CSS, jQuery, Google Maps)
    • Project Introduction: Distance Between Cities (HTML. CSS, jQuery, Google Maps)
    • Skeleton and decoration
    • App Logic using an illustrative flowchart
    • Javascript Code
    • Distance Between Cities App Source Code
    • Distance Between Cities App Quiz
  • Professional Project: Website with Social Widgets (Facebook, Google+ & Twitter)
    • Project Introduction: Website with Social Widgets (Facebook, Google+ & Twitter)
    • Skeleton and decoration
    • Facebook Widgets
    • Google plus Widgets
    • Tweet Button
    • Twitter Timeline
    • Website Source Code
    • Social Widgets Quiz
  • IOS and Android Mobile Applications using jQuery Mobile
    • Introduction
    • Mobile Apps Chapter: Roadmap and Full Source Code
    • Pages, Dialogs and Transitions
    • Navbars
    • Grid System
    • List Views
    • Form Inputs
    • Events
    • jQuery Mobile Quiz
  • Professional Project: Speed Reader for IOS and Android
    • Project Introduction: Speed Reader for IOS and Android
    • App Skeleton and Decoration (1)
    • App Skeleton and Decoration (2)
    • Logic of the App using an illustrative flowchart
    • Start Reading (1)
    • Start Reading (2)
    • Pause, Resume, Restart
    • Change the font size
    • Change the reading speed
    • Control Reading Progress: Go backwards and forward
    • Publish your app to Google Play
    • Publish your app to the IOS App Store (1)
    • Publish your app to the IOS App Store (2)
    • Speed Reader App Source Code
    • Speed Reader App Quiz
  • Professional Project: Car Sharing Website (Javascript, PHP, MySQL, AJAX, JSON)
    • Project Introduction: Car Sharing Website (Javascript, PHP, MySQL, AJAX, JSON)
    • Signup/Login Code (1)
    • Signup/Login Code (2)
    • Signup/Login Code (3)
    • Search Page Skeleton & Decoration (1)
    • Search Page Skeleton & Decoration (2)
    • Search Page Skeleton & Decoration (3)
    • Search Page Skeleton & Decoration (4)
    • Search Page Skeleton & Decoration (5)
    • Profile Picture Code (1)
    • Profile Picture Code (2)
    • Profile Picture Code (3)
    • Profile Picture Code (4)
    • Trips Page Skeleton & Decoration (1)
    • Trips Page Skeleton & Decoration (2)
    • Trips Page Skeleton & Decoration (3)
    • Website Logic
    • "Create a Trip" Code (1)
    • "Create a Trip" Code (2)
    • "Create a Trip" Code (3)
    • "Create a Trip" Code (4)
    • "Load Trips" Code (1)
    • "Load Trips" Code (2)
    • "Edit/Delete Trips" Code (1)
    • "Edit/Delete Trips" Code (2)
    • "Edit/Delete Trips" Code (3)
    • "Edit/Delete Trips" Code (4)
    • "Search Trips" Code (1)
    • "Search Trips" Code (2)
    • "Search Trips" Code (3)
    • "Search Trips" Code (4)
    • "Search Trips" Code (5)
    • "Search Trips" Code (6)
    • "Search Trips" Code (7)
    • "Search Trips" Code (8)
    • "Spinner" Code (1)
    • "Spinner" Code (2)
    • Finishing Touches & Congratulations
  • Further Reading
    • Extra Resources for Further Reading
    • Bonus Lecture

پیشنهاد آموزش مرتبط در فرادرس

خرید لینک های دانلود
  • حجم فایل: 24.46GB
  • زبان: انگلیسی
  • زیرنویس انگلیسی: دارد
  • قیمت: 10000 تومان
  • دوره کامل توسعه وب 2020 - ساخت 15 پروژه یک محصول ویژه است و دریافت لینک های دانلود آن با پرداخت هزینه امکان پذیر است. اطلاعات بیشتر