HTML چیست

• Tools - browsers - IDE - texteditor
• How the web works
• host چیست
• domain چL:
  یست
• sketch و wireframe چیست
• نقش html و css و javascript در صفحات وب
• تعریف وبسایتهای ایستا (static)
• تعریف وبسایتهای پویا (dynamic)
• تفاوت وبسایتهای پویا (dynamic) و وبسایتهای ایستا (static)
• front-end چیست و به چه کسی front-end developer میگویند
• back-end چیست و به چه کسی back-end developer میگویند
• تعریف زبان های مفسری (Interpreter)
• تعریف زبانهای کامپایلری (Compiler)
• فرق زبان های نشانه گذاری و برنامه نویسی
• tag چیست و چند نوع تگ داریم
• ساخت اولین صفحه با html
• Doctype چیست
• توضیح تگهای html - head - body - title
• متا تگ ها
• seo چیست
• تگهای headings
• attribute در تگ
• تگ paragraph
• تگ br و hr
• تگ anchor (a)
• آدرس دهی relative و absolute
• تگ img (jpg , png , gif , svg , webp )
• تفاوت bitmap و vector
• تگهای strong - em - i
• div - span
• block و inline
• تگهای ul li - ol li - dl dt dd
• تگهای table - thead - tbody- tfoot - tr - th - td
• تگ form - inputs - textarea - label
• تگ select - option - optgroup
• تگ fieldset - legend
• تگ iframe

HTML 5:

• تگ header
• تگ footer
• تگ main
• تگ nav
• تگ section
• تگ article
• تگ aside
• تفاوت div و section
• تگ figure - figcaption
• تگ audio
• تگ video
• تگ address
• تگ time
• تگ mark
• تگ cite
• svg چیست
• canvas چیست

CSS:

• css inline-internal-external
• selector ها در css
• تعریف font و انواع web font
• استفاده font-awesome از طریق file
• استفاده font-awesome از طریق cdn
• web font generators
• font-icon ها
• رنگها در css
• تفاوت طراحی flat و realism
• background-color
• background-image
• background-postion
• background-repeat
• background-size
• background-clip
• multi-backgorund
• background-blend-mode
• gradients
• text-decoration
• text properties (color - fontsize - font-weight - font-style ...)
• list-styles
• border - outline
• css3 and prefixes
• border-radius
• box-shadow
• text-shadow
• filter ها در css
• css pseudo classes (:hover , :active , :first-child , ....)
• css pseudo elements (:after , :before , ....)
• inline و block و inline-block
• vh و vw
• float
• margin - padding - box-sizing
• positions
• transforms
• transform 3d
• transitions
• animations
• css clicks
• variables in css
• ریسپانسیو چیست

media query:

• em - rem
• ساخت یک وبسایت ریسپانسیو با float به عنوان اولین پروژه
• طراحی یک وبسایت توسط دانشجو با float به عنوان اولین پروژه
• شروع کار با git - github
• معرفی version control git
• معرفی github - bitpucket - gitlab
• دستور status در گیت
• دستور add در گیت
• دستور commit در گیت
• دستور push در گیت
• دستور clone در گیت
• فرستادن پروژه روی وبسایت github
• آپلود پروژه در (heroku یا netlify یا githubpages)

flexbox:

• display flex و inline-flex
• flex container و flex items
• flex-direction
• justify-content
• align-items
• align-content
• flex-wrap
• flex-flow
• flex-basis
• flex-grow
• flex-shrink
• align-self
• order
• flex و position (absolute - fix)
• طراحی یک سایت ریسپانسیو با flex-box به عنوان دومین پروژه
• طراحی یک وبسایت توسط دانشجو با flex-box به عنوان دومین پروژه

display Grid:

• grid vs flex
• grid-template
• grid-template-clumns
• grid-template-rows
• grid-template-areas
• grid-area
• grid-auto-comumns
• grid-auto-flow
• grid-gap
• grid-row
• grid-row-start
• grid-row-end
• minmax - spanning
• fraction in grid
• طراحی یک سایت ریسپانسیو با display:grid به عنوان سومین پروژه
• طراحی یک وبسایت توسط دانشجو با display:grid به عنوان سومین پروژه

Bootstrap:

• bootstrap چیست و انواع framework css
• bootstrap 4 vs bootstrap 3
• توضیح فایل ها و ساختار bootstrap
• اضافه کردن bootstrap به صفحات
• مروری بر فایل bootstrap.css
• minify چیست
• containers
• grid ها و ستون بندی ها در bootstrap
• Typography
• colors
• tables
• images
• jumbotron
• alerts
• buttons - buttons group
• progressbar
• spinners
• pagination
• list groups
• cards
• dropdowns
• collapse
• navs - navbar
• forms
• inputs
• utilities (margins - paddings - colors - background-colors - flex classes - borders ...)
• carousel
• modal
• tooltip
• popover
• scrollspy
• طراحی یک سایت ریسپانسیو با bootstrap به عنوان چهارمین پروژه
• طراحی یک وبسایت توسط دانشجو با bootstrap به عنوان چهارمین پروژه

SASS:

• sass چیست
• css preprocessor ها و انواع آن
• variables
• nesting
• mixins
• extends
• functions
• طراحی یک سایت ریسپانسیو با sass به عنوان پنجمین پروژه
• طراحی یک وبسایت توسط دانشجو با sass به عنوان پنجمین پروژه

JAVASCRIPT & ES6:

• javascript چیست
• تاریخچه Javascript
• تفاوت Ecmascript و Javascript
• ابزارهای مورد نیاز
• استفاده از console 
• اجرای کدهای js در مرورگر
• اجرای کدهای js در terminal توسط node
•  استفاده از Alert 
• Document.write
• variables
• Data types
• Numbers
• Strings
• Boolean
• Null
• Undefined
• Arrays
• Objects
• Date
• operators
• Type coercion
• دستورات شرطی if - else - if else - switch case
• حلقه های for - while - do while
• functions
• function scope and global scope
• IIFE Immediately Invoked Function Expression
• Function Recursive
• Arguments
• Objects

مفهوم Prototype:

• ارث بری در Prototype
• کار با call
• کار با bind
• کار با apply
• Setinterval
• Settimeout
• String methods
• MATH methods
• time methods
• Array methods
• BOM چیست و کار با آن
• ِDOM چیست

شروع کار با DOM:

• Selector ها در DOM
• Elements method and perperties (delete element - create element - ....)
• DOM method and propeties
• Events
• This
• Local storage
• XML چیست
• JSON چیست
• تفاوت JSON و XML

کار با Ajax:

• انجام چند پروژه javascript (example : toodList - image slide - modal - sticky menu - game and ...)
• (ES6 (ecmascript 6 and more
• es6 چیست
• let and const
• Template Strings
• Arrow functions
• Arrow Functions vs Traditional Functions
• This in arrow functions
• Arguments in arrow function
• (map (es5
• (forEach (es5
• For of
• find
• filter
• reduce
• Some
• every
• Rest params
• Spread
• Strings new methods
• class
• class inheritance and extends
• Static methods
• super
• Object new methods
• Getter and Setter
• fetch
• Callback hell
• Promise
• Promise All
• Async and await
• Modules - export - import
• انجام چند پروژه و معرفی فریم ورک های محبوب javascript

JQUERY:

• Jquery چیست
• Jquery in dom
• Selectors
• css methods
• jquery and dom
• html and text method
• $(this(in jquery
• siblings
• parents
• childrens
• find
• filter
• append
• appendto
• prepend
• prependto
• after
• before
• remove elements
• replace elements
• mouse events (hover - click ....)
• keyboard events
• forms and validation
• animations in jquery (animate)
• show and hide and toggle
• fadeIn and fadeOut and fadeToggle
• slideup and slidedown and slidetoggle

ajax:

• کار با plugin ها
• طریقه نوشتن plugin
• پیاده سازی مفاهیم در قالب مثال و پروژه (example : smooth scroll - parallax - accordion - slider scroll and ...)
• Jquery UI
• آشنایی با jquery ui
• چگونگی استفاده از jquery ui

• همه علاقمندان به حوزه برنامه نویسی وب در همه پلتفرم ها

• پیاده سازی حرفه ای سمت کاربر وب سایت ها