راهنمایی قدم به قدم

از کجا شروع کنم؟ چه زبانی یادبگیرم؟ یادگیری کدوم رو اول شروع کنم؟ ترتیب یادگیری ویدئو های آموزشی موجود توی وب پروگ چیه؟ چطور ادامه بدم؟

جواب تمام سوالاتتو توی این بخش پیدا میکنی !!

هدف چیه ؟

در این بخش مسیر یادگیری و تبدیل شدن به وب دولوپر را به صورت قدم به قدم بیان کرده ایم تا بتوانید از میان تکنولوژی ها و مسیرهای مختلف, بهترین مسیر را انتخاب کنید.

  • این بخش بصورت مداوم آپدیت خواهد شد و سعی کنید دائما آن را چک کنید
  • استفاده از این بخش رایگانه و اگر بعد از مطالعه هنوز مسیر یادگیریت مشخص نشد, با هامون تماس بگیر

انتخاب کن و طبق برنامه قدم هاتو بردار

طبق برنامه روی دوره ها کلیک کن و یادگیری رو شروع کن.

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

  • قدم صفر :‌ آشنایی با مقدمات و اصطلاح های دنیای وب
  • قدم یکم :‌ آشنایی با HTML و CSS

    دوره رایگان آموزش HTML۵ & CSS۳ پروژه محور

    HTML برگرفته از حروف اول عبارت HyperTextMarkupLanguage می باشد و به عنوان یک زبان نشانه گذاری متن ( زبان استاندارد صفحات وب ) می باشد. معمولا در یک صفحه ی موجود بر روی وب مجموعه ای از متن ها، عکس ها، بخش بندی های مختلف وجود دارد، به کمک تگ ها و کدهایی که HTML در اختیارتان قرار می دهد، می توانید یک ساختار مشخص از اطلاعات را در این قسمت ها به وجود آورید و در معرض نمایش بازدیدکنندگان قرار بدهید.
    Css کوتاه شده یا مخفف عبارت Cascading Style Sheets می باشد که قابلیت صفحه آرایی؛ استایل دهی و زیبا سازی صفحات وب را برای طراحان سایت فراهم می سازد. در واقع ساختار یک صفحه با استفاده از HTML تعیین می شود و سپس با به کار بردن کدهایی دیگر به این ساختار و چیدمان استایل داده می شود. تمامی رنگ ها، ابعاد و اندازه ها، حاشیه ها، مکان قرارگیری، فونت ها و سایر خصوصیات اجزای یک صفحه ی وب، با استفاده از CSS تعیین خواهند شد این قدم پایه و اساس طراحی وب هست

    دوره رایگان آموزش HTML۵ & CSS۳ پروژه محور

  • قدم فرعی :‌ آشنایی با Emmet

    دوره رایگان آموزش Emmet

    Emmet یک ابزار برای توسعه‌دهندگان وب است که می‌تواند سرعت نوشتن کد‌های HTML و CSS را تا حد بسیار زیادی افزایش دهد. این ابزار بصورت یک پلاگین در ویرایشگر‌های کد مختلف نصب می‌شود.در این دوره قصد داریم با Emmet و اختصارات آن آشنا بشیم.

    دوره رایگان آموزش Emmet

  • قدم دوم : آشنایی با Responsive Layout در CSS

    دوره رایگان آموزش Responsive Layout پروژه محور

    Responsive یا واکنشگرا به این معنی می باشد که ما چگونه سایت را به شکلی طراحی کنیم که سایت ما در دیوایس های مختلف به خوبی نمایش داده بشه و این امر در SEO هم تاثیر بسزای دارد. برای آشنای بیشتر حتما قسمت معرفی دوره را مشاهده کنید. توی این قدم با هم یک قدم به طراحی حرفه ای نزدیک تر میشویم.

    دوره رایگان آموزش Responsive Layout پروژه محور

  • قدم سوم : آشنایی با Animation,Transition,Transform در CSS

    دوره آموزش Animation,Transition,Transform پروژه محور

    در این دوره فوق العاده کاربردی قرار هست در مورد Transition , Transform و Animation در CSS با هم دیگه صحبت کنیم و در قالب مینی پروژه آنها رو با هم دیگه بهتر یاد بگیریم.این دوره برای کسانی که میخواهند یک قدم به دنیای حرفه ای Front-End نزدیک بشن هست.توی این دوره مبحث های پیشرفته از CSS را قرار هست باهم دیگه کار کنیم پس نیاز هست که شما با CSS آشنایی خوبی داشته باشید. که توی قدم یکم و دوم آشنا شده اید

    دوره آموزش Animation,Transition,Transform پروژه محور

  • قدم چهارم : آشنایی با FlexBox در CSS

    دوره رایگان آموزش FlexBox پروژه محور

    Flexbox ها کدهای جدید در CSS می باشند که توسط W۳C برای رفع مشکلات استفاده از کد های float و طراحی زیبا و دقیق تر سایت ها بخصوص سایت های ریسپانسیو ارائه شده است. توی این قدم بسیار مهم هست که شما با مبحث FlexBox آشنا شوید.چون توی قدم های دیگه خیلی کارش داری.

    دوره رایگان آموزش FlexBox پروژه محور

  • قدم پنجم : آشنایی با Grid Layout در CSS

    دوره رایگان آموزش Grid Layout پروژه محور

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

    دوره رایگان آموزش Grid Layout پروژه محور

  • قدم ششم : آشنایی با SASS

    دوره رایگان آموزش SASS پروژه محور

    اگر به تازگی وارد دنیای طراحی وب شده‌اید مطمئنا نام Sass یا پیش‌پردازنده‌ها را شنیده‌اید. اگر مطمئن نیستید که Sass چیست و نمی‌دانید که باید از آن استفاده کنید یا خیر، ما امروز قصد داریم به شما کمک کنیم.
    SASS مخفف Syntactically Awesome Style Sheets و یک زبان پیش‌پردازنده برای تولید کد Css است. این زبان به هیچ عنوان جایگزین Css محسوب نمی‌شود و می‌توان آن را روشی برای توسعه و مدیریت کدهای Cssدانست.
    SASS امکان استفاده از متغیرها (Variables)، دستورات تودرتو (Nesting)، وارد کردن قطعه کدها (Partial Imports)، گروه‌بندی کدها (Mixins)و وراثت (Inheritance) را در کدهای Css را فراهم می‌کند. کدهای SASS در نهایت کامپایل و به Css تبدیل می‌شوند.
    برای بهتر فهمیدن Sass حتما ویدو معرفی دوره را مشاهده کنید

    دوره رایگان آموزش SASS پروژه محور

  • قدم هفتم : آشنایی با Bootstrap

    دوره رایگان آموزش Bootstrap۴ پروژه محور

    Bootstrap مجموعه ای از ابزارهای رایگان برای ایجاد صفحات وب و نرم افزارهای تحت وب است که شامل دستورات HTML، CSS و توابع جاوا اسکریپت جهت تولید و نمایش فرم ها، دکمه ها، تب ها، ستون ها و سایر المان های مورد نیاز طراحی وب می باشد.
    بزرگترین مشکل طراحان وب و کدنویسان قدیمی، ایجاد ظاهری زیبا و مناسب است! بله دقیقا مشکل اساسی اینجاست. اصول کدنویسی و ایجاد زیربنا و ساختار مناسب برای یک سایت بسیار مهم و پیچیده است ولی نمایش صحیح خروجی کار و ایجاد یک فضای کاربرپسند نیز اهمیت بسیار بالایی خواهد داشت.
    Bootstrap قصد دارد که خلاء میان طراحی و کدنویسی را از میان برداشته و کدنویسان را ترغیب به استفاده از طراحی های پیش فرض و استاندارد نماید. به همین منظور دستورات CSS و توابع jQuery مورد نیاز را برای شما فراهم کرده است تا شما بتوانید با استفاده از دستورات پیش فرض و رعایت اصول متناسب با طراحی Bootstrap زمان راه اندازی یک پروژه را تا حد زیادی کاهش داده و خروجی آن را متناسب با استانداردهای روز دنیا پیش ببرید.
    در این قدم قصد دارم شما را از مبتدی تا پیشرفته با بوت استرپ آشنا کنم و با ایجاد یک پروژه Bootstrap به شما بصورت کامل آموزش بدم.

    دوره رایگان آموزش Bootstrap۴ پروژه محور

  • قدم هشتم : Bootstrap ۴ در دنیای واقعی

    آموزش Bootstrap ۴ در دنیای واقعی

    بعد از مشاهده قدم هفتم نیاز هست که شما دوستان عزیز ‌Bootstrap را در دنیای واقعی مشاهده کنید. به این معنی که شما با پروژه های مختلف مانند Single Page و Comming Soon و Admin Panel و Portfolio Page و هر سایتی که مد نظرتون هست را بتونید به راحتی با Bootstrap ایجاد کنید.
    در این دوره قصد داریم ۹ پروژه کاربردی که در بالا گقته شد را باهم دیگه ایجاد کنیم
    حتما حتما معرفی دوره را مشاهده کنید.

    آموزش Bootstrap ۴ در دنیای واقعی

  • قدم فرعی : آشنایی با Materialize css

    آموزش Materialize پروژه محور

    آموزش Materialize به همراه ۳ پروژه.
    Materialize مجموعه ای از رابط های کاربری ساخته شده با CSS و HTML و Javascript هست و یک فریمورک فرانت اند همانند Bootstrap اما با طراحی متریال که در قسمت اول به توضیح آن پرداخته ایم. با استفاده از این ابزار میتونین به سادگی و با جذابیت هر چه تمامتر به طراحی و کدنویسی بپردازید، که از قواعد و اصول استاندارد در زمینه وب برخوردار هست و پشتیبانی خوبی بر روی مرورگرهای بروز و مدرن داره. این ابزار به شما کمک میکنه که سایتهایی متریال و زیبا، سریع و واکنشگرا بسازید. این ابزار از Google Material Design ایده گرفته و از روی قواعد مربوط به اون ساخته شده است.
    این مجموعه برای کسانی تهیه شده است که قصد دارند با طراحی متریال آشنا بشن و کار کنند و همه موارد مرتبط با Materialize در اختیار شما قرار خواهد گرفت و میتونین از اون بهره مند بشید.
    حتما حتما معرفی دوره را مشاهده کنید.

    آموزش Materialize پروژه محور

  • قدم نهم : آموزش Javascript

    آموزش Javascript پروژه محور

    آموزش جاوا اسکریپت + ES۶ به همراه پروژه
    جاوا اسکریپت زبان برنامه‌نویسی سطح بالا است که برای ایجاد تعامل با صفحات وب به کار می‌رود. جایی که HTML و CSS ساختار اولیه و ظاهر صفحات وب را تعیین می‌کنند، جاوا اسکریپت نحوه عملکرد صفحات وب را کنترل می‌کند.
    جاوا اسکریپت، تجربه کاربر را از صفحه وب با تبدیل آن از یک صفحه استاتیک به یک صفحه تعاملی بهبود می‌بخشد. بطور خلاصه، جاوا اسکریپت به صفحات وب رفتار می‌بخشد. در این چند سال اخیر بشدت محبوب و قدرتمند شده. فریمورک و کتابخانه های مدرنی از جاوا اسکریپت قدرت میگیرن مانند Vue.js , React.js و ....
    وبرای یادگیری این فریمورک و کتابخانه ها نیاز است شما با جاوا اسکریپت به خوبی آشنا باشید. یادگیری جاوا اسکریپت از الزامات دنیای وب هست.
    حتما حتما معرفی دوره را مشاهده کنید.

    آموزش Javascript پروژه محور

  • قدم فرعی : آموزش Javascript OOP

    آموزش Javascript OOP پروژه محور

    این دوره برای کسانی هست که قصد دارند یک قدم به دنیای حرفه ای جاوا اسکریپت نزدیک بشن.
    OOP برگرفته از Object-Oriented Programming به معنی برنامه‌نویسی شی‌گرا میباشد. که یک الگو یا روش برنامه نویسی می باشد که اساس این الگو بر پایه اشیاء می باشد.
    مفهوم OOP در اکثر زبان های برنامه نویسی وجود دارد اما در این دوره قصد داریم این مفهموم را در دنیای جاوا اسکریپت بررسی کنیم.
    جاوا اسکریپت زبان برنامه‌نویسی سطح بالا است که برای ایجاد تعامل با صفحات وب به کار می‌رود. جایی که HTML و CSS ساختار اولیه و ظاهر صفحات وب را تعیین می‌کنند، جاوا اسکریپت نحوه عملکرد صفحات وب را کنترل می‌کند.

    آموزش Javascript OOP پروژه محور

  • قدم فرعی : آموزش Asynchronous Javascript

    آموزش Asynchronous Javascript پروژه محور

    این دوره برای کسانی هست که قصد دارند یک قدم به دنیای حرفه ای جاوا اسکریپت نزدیک تر بشن.
    در این دوره با برنامه نویسی Asynchronous (ناهمگام) و Synchronous (همگام) و نحوه کارکرد آنها در دنیای جاوااسکریپت صحبت میکنیم.بحث فوق العاده مهم در جاوااسکریپت که به دوستان علاقه مند به جاوااسکریپت اکیدا توصیه میشه!!!
    در این دوره در مورد Callback, Promise, Async/Await صجبت میکنیم, در مورد API و AJAX در جاوااسکریپت و همچنین استاندارد جدید Fetch API که جایگزین AJAX هست. در نهایت پروژه وضع آب و هوا از طریق API و مباحثی که یاد گرفتیم ایجاد میکنیم.

    آموزش Asynchronous Javascript پروژه محور

  • قدم فرعی : آموزش jQuery

    آموزش jQuery پروژه محور

    بعد از مشاهده قدم نهم اکنون میتوانید با کتابخانه و فریمورک های جاوا اسکریپت آشنا بشین
    آموزش jQuery به همراه ۴ پروژه.
    jQuery یک کتابخانه (Library) برای جاوا اسکریپت است. منظور از کتابخانه مجموعه کدهایی است که در یکجا جمع شده اند و قرار است کاری را برای ما انجام دهند.
    اگر بخواهیم جی کوئری را در چند خط کوتاه توضیح دهیم میتوانیم بگوییم:
    جی کوئری یک کتابخانه‌ی کاملا رایگان برای جاوا اسکریپت می‌باشد. شما با استفاده از جی کوئری میتوانید اسکریپت های قدرتمندی را تنها با چند خط کد بنویسید. جی کوئری برای ساخت انیمیشن،‌ درخواست های Ajax, افکت های ظاهری و دستکاری صفحات وب عالی است. و ....
    حتما حتما معرفی دوره را مشاهده کنید.

    آموزش jQuery پروژه محور

  • قدم دهم : آموزش PHP و MySQL

    آموزش PHP و MySQL پروژه محور

    بعد از مشاهده قدم نهم شما باید تاکنون با برنامه نویسی سمت کلاینت به خوبی آشنا شده باشید اکنون میتوانید با زبان های سمت سرور و دیتابیس آشنا بشین
    آموزش PHP و MySQL به همراه پروژه وبلاگ
    PHP یک زبان برنامه نویسی است که میتوانیم با استفاده از آن اقدام به ساخت صفحات وب داینامیک (Dynamic) کنیم.MySQL یک سیستم مدیریت دیتابیس است که با استفاده از آن‌، میتوانیم یک دیتابیس بسازیم و آن‌را مدیریت کنیم. که در انلگیسی به آن Database Management System یا به اختصار DBMS نیز میگویند.در این دوره قصد داریم با PHP و MySQL آشنا بشیم و این آموزش ها را در قالب یک پروژه وبلاگ پیاده سازی کنیم
    حتما حتما معرفی دوره را مشاهده کنید.

    آموزش PHP و MySQL پروژه محور

  • قدم فرعی : آموزش PHP-OOP-MVC پروژه محور

    آموزش PHP-OOP-MVC پروژه محور

    آموزش PHP-OOP-MVC به همراه پروژه ساخت فریمورک MVC
    OOP برگرفته از Object-Oriented Programming به معنی برنامه‌نویسی شی‌گرا میباشد. که یک الگو یا روش برنامه نویسی می باشد که اساس این الگو بر پایه اشیاء می باشد.
    MVC مخفف کلمات Model-View-Controller هست. در واقع MVC یک الگوی طراحی (design pattern) جهت جداسازی قسمت های مختلف برنامه است.
    در این دوره فوق العاده کاربردی شی گرایی و MVC را در PHP یاد میگیریم و با کمک آنها یک فریمورک MVC ایجاد میکنیم. و با کمک این فریمورک پروژه ای را ایجاد میکنیم که در آن بحث User Athentication یا احراز هویت کاربر و همچنین چهار عمل اصلی دیتابیس یعنی ایجاد کردن, خواندن, ویرایش و حذف را در قالب Article یا مقاله پیاده سازی میکنیم. هدف این دوره آشنایی شما با شی گرایی و MVC در PHP هست به این دلیل که اکثر فریمورک های PHP بر پایه شی گرایی و MVC می باشند و این دوره به شما کمک می کند که یادگیری فریمورک ها PHP برای شما آسان شود و شما به خوبی نحوه کار فریمورک ها را درک کنید

    آموزش PHP-OOP-MVC پروژه محور

  • قدم فرعی : آموزش Composer

    آموزش Composer

    کامپوزر ابزاری برای مدیریت وابستگی(dependency management) در پروژه‌های PHP است. ابزار فوق به شما این امکان را می‌دهد که به راحتی وابستگی‌های پروژه خود را نصب و به روز رسانی کنید.
    در واقع Dependencyها یا همان وابستگی‌ها، پکیج‌ها و یا کتابخانه‌هایی هستند که قبلا توسط توسعه دهندگان ایجاد شده و دیگر نیاز به نوشتن مجدد آن‌ها نیست. برای سهولت و کاهش زمان کدنویسی، سایر توسعه دهندگان می‌توانند از این وابستگی‌ها به صورت رایگان استفاده کنند.
    برای دوستانی که قصد دارند با فریمورک های بزرگ PHP مانند لاراول کار کنند و یادبگیرند نیاز هست با کامپوزر آشنا باشند. برای آشنایی بیشتر ویدیو معرفی دوره را حتما ببینید.

    آموزش Composer

  • قدم یازدهم : آموزش Laravel

    آموزش Laravel

    لاراول یکی از بهترین و محبوب ترین فریمورک های زبان php است که برای توسعه نرم افزارهای تحت وب و بر پایه ای معماری MVC ساخته شده.
    راحتی کار با لاراول و سادگی در یادگرفتن آن در عین پر قدرت بودن و حرفه ای بودن این فریمورک موجب شده تا افراد بسیاری به سوی این فریمورک حرکت کنند و از قدرت آن در پروژه های خود استفاده کنند.لاراول به علت داشتن امنیت بالا، امکانات به روز، توسعه پذیری بالا، استفاده از کدهای با کیفیت و جدیدترین روش‌ها به عنوان یک فریم ورک قوی و پیشرفته شناخته می شود.با وب پروگ همراه باشید تا با این فریمورک دوست داشتنی آشنا بشیم.

    آموزش Laravel