به‌روزرسانی در 1402-11-01

مقدمه ای بر FrontEnd

هنرجوهای عزیزم، دقت کنید طراحی سایت و کلاً ساختار یک سایت بصورت خیلی کلی به دو قسمت بزرگ بنام های فرانت اند (Frontend) و بک اند (Backend) تقسیم میشه. در این دوره بصورت کاملاً حرفه ای و بررسی تمام جزئیات و دستورات، به آموزش کل مباحث فرانت اند میپردازیم.

حالا فرنت اند چیه؟

بذار با یک مثال برای همیشه در ذهنت شکل بگیره این تعریف! فکر کن شما یک استاد بنا هستی که صفر تا صد ساخت یک بنا به عهده شماست. اولین مرحله چیست؟ قطعاً محاسبه نیازمندی ها و نقشه کشی ها اما منظور از سوال ما فرایند های عملی است. بنابراین اولین مرحله پی ریزی اولیه فونداسیون آن بنا است (در اینجا شما با زبان (HTML) کار دارید). حالا وقت قشنگ کردن بناست، آجرنما، سنگ کف ساختمان، پنجره ها و… (در اینجا نیازمند زبان سی اس اس (CSS) هستید) و در نهایت مسائل خاصی هیت که مشتریان پولدار به شما سفارش میدهند مثلاً احتیاج به آسانسور دارند یا نیازمند آبنما در یک پاگرد این بنا هستند (در اینجاست که زبان جاوااسکریپت (JS) میتونه به شما کمک کند).

پس فهمیدی Frontend سه رکن جدا نشدنی داره:

  1. زبان نشانه گذاری HTML
  2. زبان نشانه گذاری CSS
  3. زبان برنامه نویسی JS

شروع فرانت اند (Frontend) با HTML نسخه 5 #

اولین موردی که برای کدنویسی HTML مورد نیاز است، یک IDE یا همان ویرایشگر کدهاست. قوی ترین ابزاری که من تا بحال باهاش کارکردم PHP Storm – JetBrains هست. نرم افزاری کامل و جامع برای برنامه نویسانی که قصد طراحی سایت رو دارند. علاوه بر این که کد های مربوط به فرانت اند رو شناسایی و باگ زدایی میکنه، قابلیت ویرایش زبان پی اچ پی (PHP)، کتابخانه عظیم لاراول (Laravel) و افزونه (Plugin) و قالب (Theme) وردپرس (WordPress) را نیز دارد.

البته خیلی از همکاران عزیز با نرم افزار هایی همچون ویژوال استادیو (Visual Studio) یا ویژوال استادیو کد (Visual Stadio Code) یا اتم (Atom) کار میکنند که برای نظر و انتخاب آنها احترام قائلیم و اصل برنامه نویسی است و این موضوعات همگی فرعی هستند. با این حساب نرم افزار اتم و ویژوال استادیو کد رایگان هستند و بقیه نرم افزار های نام برده دارای لایسنس میباشند. من لینک دانلود تمام نرم افزار ها رو برای شما هنرجویان عزیز قرار میدهم. اما بنده در ویدئو ها و تصاویر آموزش ها از نرم افزار PHP Storm استفاده کرده ام.

دانلود نرم افزار های مورد نیاز #

بررسی تاریخچه تکنولوژی های کاربردی فرانت اند (Frontend) #

واقعاً دانستن تاریخچه یک زبان رنامه نویسی یا نشانه گذاری مهم نیست. و به هیچ وجه برای شما کاربردی نخواهد بود. اما توصیه من به شما اینه وقتی داری یک کاری را به عنوان شغل آینده بهش نگاه میکنی پس در اون کار، استاد باش، همه چیزو بدون! سخت نیست. علاوه بر این باید بدونیم که تکنولوژی هایی که باهاش کار میکنیم رو کی ساخته تا برای اون افراد احترام قائل باشیم و بدونیم کجای دنیا قرار گرفتیم…

نظر درباره این مستند؟

ثبت سفارش سریع پروژه شما

کمتر یک ساعت در ساعات کاری با شما تماس حاصل میشود. تنها پروژه ی خود را طور خلاصه شرح دهید یا اگر فایلی مرتبط با ان دارد باگذاری کنید.

ارتباط سریع

فرم زیر را تکمیل کنید. در ساعات کاری کمتر از یک ساعت پس از ارسال با شما تماس کرفته میشود.