ضمن عرض خیر مقدم به همه دوستان عزیز

این کانال، همان کانال سابق است چون سازنده کانال رمز دو مرحله ای خودش را فراموش کرده و ایمیل بازیابی نداده دسترسی به اکانت خود را نداره و تلگرام خودش بعد یک هفته اکانت را ریسیت میکنه کاملا.

دوباره از نو همه پست‌ها و آموزش‌ها + گروه‌ها را میذارم

مدیریت تیم پرش

📌 #سوال
📌 #وب
📌 #طراحی_سایت

⁉ طراحی سایت از کجا شروع کنم؟


✅ گام اول : زبان استاتیک html ولی این یک زبان نیست و در واقع باید گفت این یک زبان نشانه گذاری است.

✅ گام دوم : css برای خصوصیت و ویژگی به عناصر و تگ ها که با دو روش می‌توان به تگ ها خصوصیت بدیم :
1. کلاس : کلاس با نقطه یا دات (.) شروع می‌شود و بعد نام دلخواه. مثال:
.test{
color: red;
background-color: #ffff00;
}
2. آیدی : آیدی با شارپ (#) شروع می‌شود و بعد نام دلخواه. مثال :
#test{
color: green;
background-color: yellow;
}
البته بهتر است رنگ‌های پس زمینه را رنگ‌های جیغ و پر رنگ نذاریم.
روش‌های مقداردهی css را هم می‌توان به 3 شکل انجام بدیم :
1. خطی یا inline : یعنی درون همون تگ
<div style="color : red; "></div>
2. داخلی یا internal : یعنی درون تگ نباشه کلی توی همون صفحه باشه که در این صورت باید به عنصر کلاس یا ایدی داد
<div class="test"></div>
داخل صفحه css :
.test{
color: green;
}
3. خارجی یا external : یعنی نه داخل صفحه باشه و نه درون تگ. در یه صفحه دیگه با پسوند css باشه مثلا style.css
.test{
color: blue;
}

‼️ نکته : بهتر است از خارجی استفاده کنین چون در روش داخلی و خطی در بین مثلا 17000 خط کد اگه جایی رو اشتباه نوشته باشیم نمی‌توانیم به راحتی تغییر بدهیم.

✅ گام سوم : یادگیری جی کوئری و جاوا اسکریپت

✅ گام چهارم : یادگیری بوت استرپ => برای ریسپانسیو کردن سایت

⁉ ریسپانسیو کردن چیست؟
به این معنا که سایت در دستگاه‌های مختلف از جمله موبایل، کامپیوتر، لپ تاپ و... در اندازه‌های مختلف به درستی اجرا شود و سایت به هم نریزه.

✅ گام پنجم : بهینه سازی وبسایت یا سئو

⁉ بهینه سازی وبسایت یا سئو چیست؟
به این معنا که سایت ما در موتور جستجوها از جمله گوگل و... در اولین صفحات موتور جستجوها برامون بیاره (رسیدن به رتبه بالا)، هر چه کلمه کلیدی بیشتر در meta تگ تعریف کنیم وقتی کاربر آن کلمه را سرچ کند برایش میاورد و در نتیجه بازدید سایت هم بالا میره.

✅ گام ششم : یادگیری CMS مانند (جوملا، وردپرس - دروپال - مامبو و ...)

✅ گام هفتم : در اینجا شما باید تصمیم بگیرید که می‌خواهید سمت Front end کار کنید یا Back end.

➖ قسمت Front end به توسعه رابط کاربری و ظاهر سایت اشاره داره. مثل: تمام بخشی که در وبسایت‌های مختلف می‌بینید ترکیبی از HTML و CSS و JavaScript هستند.

➖ قسمت Back end به توسعه هسته سایت و بخش سمت سرور اشاره داره، مثل PHP و Ruby و Python البته برای راحتی کار فریمورک های مختلفی ایجاد شده‌اند که از بین آن‌ها می‌توان به Laravel و Django و Ruby on Rails که مهم‌ترین هستند اشاره کرد

✅ گام آخر : با توجه به اینکه شما بخواهید front end کار کنید و یا back end ما در php و asp یکی دیگر هم داریم که معماری سه لایه ای را پشتیبانی می‌کنند به اسم های php mvc و asp.net mvc البته دوستانی که asp می‌خواهند کار کنند قسمت دیگری هم داره به اسم asp.net core که ورژن های مختلفی ارائه شده.

⁉ کلا چند نوع سایت داریم؟
1. استاتیک یا ثابت : که نیازی به پایگاه داده نداره و نمی‌توان محتوا رو تغییر داد فقط کسی که سایت رو طراحی کرده و پشتیبانش هست می‌تواند تغییر بدهد، زبان html استاتیک هست و برای زمانی خوب هست که شما می‌خواهید فقط یک آموزش خاصی را فقط قرار بدین و به آپدیت نیاز نداره.
2. داینامیک یا پویا : که در اینجا نیاز به یه پایگاه داده داریم مثه mysql یا sql server که اطلاعات رو از اونجا بخواند، زبان‌های php و asp پویا هستند و برای زمانی خوب هست که مدام باید اطلاعات تغییر کند مثل سایت خبری یا فروشگاهی و از این دسته (منظور از مدام میتونه دقیقه به دقیقه یا روز به روز باشه)

👩‍💻 تهیه شده : توسط مهندس ضرابی

➖➖➖➖➖➖➖
✅ @WorldCode

📌 #طنز

🌀 وقتی میگن HTML زبان برنامه نویسیه ! 😅

➖➖➖➖➖➖➖
✅ @WorldCode

📌 تفاوت HTML و CSS و JavaScript در طراحی سایت :

🔸 برای درک بهتر HTML و CSS که چه نیازی هست یاد بگیریم، ابتدا تفاوتشان را بیان می‌کنیم

🌀 اچ تی ام ال ( Html ) مانند اسکلت بدن انسان است، در وبسایت در واقع شامل عناوین، متن ها، عکس ها و پاراگراف ها و ساختار پایه ای وبسایت را ایجاد می‌کند.

🌀 سی اس اس ( Css ) مانند رنگ و پوست برای بدن انسان است، در وبسایت شامل رنگ و استایل است و یک پوسته برای سایت شما است مانند پوست در بدن انسان.

🌀 جاوا اسکریپت ( Javascript ) مانند حرکت بدن انسان است مثل رقص یا قدم زدن، در وبسایت به منزله حرکت و منطق است مانند پیغام هشدار یا تاییدیه که به کاربر داده می‌شود

+ منبع : فن آسا

➖➖➖➖➖➖➖
✅ @WorldCode

تازه تاسیس است به دلیل انتقال، لطفا صبور باشید 🙏🌺

📌 #سوال
📌 #ادیتور

🤔 کدوم ادیتور و IDE بهتر است؟

🌀 دوستان برای این که ما بتونیم سایتی رو بسازیم، نیاز به ادیتور داریم

🤔 اصلا IDE چی هست؟

🌀 خود IDE میاد محیطی رو براتون ایجاد میکنه که تمام نیازهاتونو برطرف کنه

🤔 ادیتور چی هست؟

🌀 ادیتور محیطی که شما در اون قراره که کدنویسی کنید

چندین ادیتور داریم، از جمله :

🔻 1. نوت پد خود سیستم
🔻 2. Notepad++
🔻 3. Vs Code
🔻 4. Dream Weaver
🔻 5. Atom
🔻 6. Sublime Text
🔻 7. ....

🌀 در تمام ادیتورهایی که نام برده شد، شما در هر کدوم از ادیتورها که راحت هستید میتونید کدنویسی کنید

🌀 دوستان ببینید نمیشه بگیم کدوم ادیتور بهترین است چرا که هر فردی با یک ادیتور راحت به کدنویسی هست، مثلا فرد x با ++Notepad راحته ولی فرد y با Vs Code و ...

🌀 اگر مبتدی و تازه وارد هستید، پیشنهاد می‌کنیم از Dream Weaver استفاده کنید چرا که اگر از ادیتور خود سیستم Notepad استفاده کنید، عیب اولش این که باز و بسته شدن تگ براتون مشخص نیست.

🌀 یعنی چی مشخص نیست؟ یعنی این که خطوط کدنویسی شده همشون به همون حالت رنگ مشکلی پیش فرض هستن (Notepad) ولی اگر تو Dream Weaver و یا ++Notepad کدنویسی کنید رنگ خطوط مشخص است مثلا اگر در ++Notepad تایپ کنید رنگ تگ‌ها به رنگ آبی هست (عکس WorldCode1)

🌀 حال بیاییم یه جا یه تگ رو به اشتباهی تایپ کنیم، می‌بینید که اگر یه تگ رو به اشتباهی تایپ کنیم از رنگ آبی به رنگ مشکی تغییر رنگ پیدا می‌کنه (عکس WorldCode)

🌀 مثلا فرض کنید در یک پروژه ای 10000 خط کد نوشته شده و در این مابین شما یک جا رو / بسته شدن تگ رو یادتون رفته بذارین، خب طبیعتا پیدا کردن این ارور در خطوط 10000 خطی کار آسانی نیست ولی اگر همین رو تو Dream Weaver بنویسین خود Dream Weaver به محض باز شدن تگ مثلا html خود به خود یا بهتره بگم خودکار تگ html رو میبنده یعنی تا شما <html> روتایپ می‌کنید و می‌خواید برید خط بعد خود این ادیتور <html/> رو تایپ می‌کنه

در ادامه چندین ادیتور قرار می‌گیره و تگ‌ها توضیح داده میشه

❤️ جهت استفاده ناشنوایان.

‼️ توجه : آموزش تصویری تمامی مطالب هر دو جلسه یک بار منتشر می‌شود.

📌 ادامه دارد ....

👩‍💻 تهیه شده : توسط مهندس ضرابی

➖➖➖➖➖➖➖
✅ @WorldCode