✳️ مناسب‌ترین زبان برنامه‌نویسی وب برای اهداف مختلف چیست؟
پیش از انتخاب زبان برنامه‌نویسی مناسب، هر فرد باید به یک سری سؤالات بخصوص پاسخ دهد. به عنوان مثال، اگر شخصی بخواهد کدنویسی یک برنامه کاربردی تحت وب یا مرورگر را آغاز کند، چه گزینه‌هایی پیش روی خود خواهد داشت؟ یا چرا باید در شرایط بخصوص، زبان برنامه‌نویسی خاصی را به زبان‌های دیگر ترجیح داد؟ این مقاله، چک‌لیستی از یک سری سؤال مهم را در اختیار شما قرار می‌دهد که می‌توانید با در نظر داشتن و پاسخ به آن‌ها، مناسب‌ترین زبان برنامه‌نویسی وب برای خودتان را انتخاب کنید.
══ فهرست مطالب ══
○ «مناسب بودن» را برای خود تعریف کنید
○ استفاده از کدام زبان برنامه‌نویسی، آسان‌تر است؟
○ محبوب‌ترین زبان برنامه‌نویسی وب کدام است؟
○ کدامیک از زبان‌های برنامه‌نویسی وب چندمنظوره هستند؟
○ منابع آموزشی برای زبان‌های برنامه‌نویسی وب کدامند؟
○ از چه پلتفرمی استفاده می‌کنید؟
○ انتخاب توسعه فرانت‌اند (Front-End) یا بک‌اند (Back-End)؟
○ هدف شما از برنامه‌نویسی چیست؟
○ سخن آخر
🔸 «مناسب بودن» را برای خود تعریف کنید
انتخاب زبان «مناسب» می‌تواند کمی گمراه‌کننده باشد. این بدان معناست که گزینه‌های نامناسب نیز وجود دارند. برخی از زبان‌ها به شما در دستیابی به اهداف برنامه‌نویسی‌تان هیچ کمکی نمی‌کنند، با این حال در بسیاری از موارد، روش‌های متعددی برای رسیدن به خروجی مطلوب وجود دارند. این موضوع، مخصوصاً در برنامه‌نویسی وب مصداق دارد.
تمرکز اصلی برخی از زبان‌ها مانند جاوااسکریپت بر روی توسعه وب است، در حالیکه برخی دیگر مانند جاوا، به عنوان زبان‌های عمومی شناخته می‌شوند. حال باید بر روی سؤالاتی تمرکز کنید که پاسخ آن‌ها شما را در تعیین زبان برنامه‌نویسی مناسب یاری کند. در ادامه، هر یک از این سؤالات را مورد بررسی قرار خواهیم داد.
🔸 استفاده از کدام زبان برنامه‌نویسی، آسان‌تر است؟
تعیین آسان‌ترین زبان برنامه‌نویسی وب، به سابقه شما بستگی دارد. اگر تجربه‌ای در استفاده از زبان‌هایی مانند HTML داشته باشید، با مفاهیم «سینتکس» (Syntax) و «قالب‌بندی» (Layout) آشنا خواهید بود. علاوه بر این، سرعت یادگیری افراد با هم متفاوت است و همین موضوع، تعریف «آسان بودن» را برای هر فرد تعیین می‌کند. با این حال، برخی از زبان‌های برنامه‌نویسی به طور کلی نسبت به زبان‌های دیگر ساده‌تر هستند.
برای استفاده آسان از یک زبان، باید گزینه‌ای را انتخاب کنید که علاوه بر بهره‌مندی از «فریمورک» (Framework) و کتابخانه‌های متعدد، ساختاریافته، مختصر و مفید باشد. علاوه بر این‌ها، داشتن سینتکس ساده‌تر نیز به عنوان یک مزیت محسوب می‌شود. در قسمت زیر، برخی از زبان‌های مناسب برای افراد مبتدی به همراه ویژگی‌های اصلی این زبان‌ها آورده شده است:
مطالعه ادامه مطلب 👇👇
🔗 مناسب‌ترین زبان برنامه‌نویسی وب برای اهداف مختلف چیست؟ — کلیک کنید (+)
📌 کانال اختصاصی آموزشی طراحی و توسعه وب
آخرین مطالب علمی، مقالات رایگان و ویدئوهای آموزشی طراحی و توسعه وب را در کانال اختصاصی [@FaraWebDev] دنبال کنید. 👇
@FaraWebDev — مطالب و آموزش‌های طراحی و توسعه وب فرادرس
پیش از انتخاب زبان برنامه‌نویسی مناسب، هر فرد باید به یک سری سؤالات بخصوص پاسخ دهد. به عنوان مثال، اگر شخصی بخواهد کدنویسی یک برنامه کاربردی تحت وب یا مرورگر را آغاز کند، چه گزینه‌هایی پیش روی خود خواهد داشت؟ یا چرا باید در شرایط بخصوص، زبان برنامه‌نویسی خاصی را به زبان‌های دیگر ترجیح داد؟ این مقاله، چک‌لیستی از یک سری سؤال مهم را در اختیار شما قرار می‌دهد که می‌توانید با در نظر داشتن و پاسخ به آن‌ها، مناسب‌ترین زبان برنامه‌نویسی وب برای خودتان را انتخاب کنید.
══ فهرست مطالب ══
○ «مناسب بودن» را برای خود تعریف کنید
○ استفاده از کدام زبان برنامه‌نویسی، آسان‌تر است؟
○ محبوب‌ترین زبان برنامه‌نویسی وب کدام است؟
○ کدامیک از زبان‌های برنامه‌نویسی وب چندمنظوره هستند؟
○ منابع آموزشی برای زبان‌های برنامه‌نویسی وب کدامند؟
○ از چه پلتفرمی استفاده می‌کنید؟
○ انتخاب توسعه فرانت‌اند (Front-End) یا بک‌اند (Back-End)؟
○ هدف شما از برنامه‌نویسی چیست؟
○ سخن آخر
🔸 «مناسب بودن» را برای خود تعریف کنید
انتخاب زبان «مناسب» می‌تواند کمی گمراه‌کننده باشد. این بدان معناست که گزینه‌های نامناسب نیز وجود دارند. برخی از زبان‌ها به شما در دستیابی به اهداف برنامه‌نویسی‌تان هیچ کمکی نمی‌کنند، با این حال در بسیاری از موارد، روش‌های متعددی برای رسیدن به خروجی مطلوب وجود دارند. این موضوع، مخصوصاً در برنامه‌نویسی وب مصداق دارد.
تمرکز اصلی برخی از زبان‌ها مانند جاوااسکریپت بر روی توسعه وب است، در حالیکه برخی دیگر مانند جاوا، به عنوان زبان‌های عمومی شناخته می‌شوند. حال باید بر روی سؤالاتی تمرکز کنید که پاسخ آن‌ها شما را در تعیین زبان برنامه‌نویسی مناسب یاری کند. در ادامه، هر یک از این سؤالات را مورد بررسی قرار خواهیم داد.
🔸 استفاده از کدام زبان برنامه‌نویسی، آسان‌تر است؟
تعیین آسان‌ترین زبان برنامه‌نویسی وب، به سابقه شما بستگی دارد. اگر تجربه‌ای در استفاده از زبان‌هایی مانند HTML داشته باشید، با مفاهیم «سینتکس» (Syntax) و «قالب‌بندی» (Layout) آشنا خواهید بود. علاوه بر این، سرعت یادگیری افراد با هم متفاوت است و همین موضوع، تعریف «آسان بودن» را برای هر فرد تعیین می‌کند. با این حال، برخی از زبان‌های برنامه‌نویسی به طور کلی نسبت به زبان‌های دیگر ساده‌تر هستند.
برای استفاده آسان از یک زبان، باید گزینه‌ای را انتخاب کنید که علاوه بر بهره‌مندی از «فریمورک» (Framework) و کتابخانه‌های متعدد، ساختاریافته، مختصر و مفید باشد. علاوه بر این‌ها، داشتن سینتکس ساده‌تر نیز به عنوان یک مزیت محسوب می‌شود. در قسمت زیر، برخی از زبان‌های مناسب برای افراد مبتدی به همراه ویژگی‌های اصلی این زبان‌ها آورده شده است:
مطالعه ادامه مطلب 👇👇
🔗 مناسب‌ترین زبان برنامه‌نویسی وب برای اهداف مختلف چیست؟ — کلیک کنید (+)
📌 کانال اختصاصی آموزشی طراحی و توسعه وب
آخرین مطالب علمی، مقالات رایگان و ویدئوهای آموزشی طراحی و توسعه وب را در کانال اختصاصی [@FaraWebDev] دنبال کنید. 👇
@FaraWebDev — مطالب و آموزش‌های طراحی و توسعه وب فرادرس
✳️ چگونه برنامه‌نویسی وب را شروع کنم؟
برای بسیاری از افراد این پرسش وجود دارد که چگونه می‌توانند برنامه‌نویس وب شوند و باید برنامه‌نویسی وب را از کجا شروع کنند. در این مطلب از مجله فرادرس، تلاش کرده‌ایم تا پاسخ‌هایی مناسب به سئوالاتی از این دست بدهیم.
══ فهرست مطالب ══
○ می‌خواهم برنامه‌نویس وب شوم، از کجا باید شروع کنم؟
○ HTML، اولین زبان برنامه‌نویسی وب
○ CSS، زبان مخصوص استایل‌دهی
○ جاوا اسکریپت، نخستین زبان اسکریپت‌نویسی تحت وب
○ jQuery، یکی از مهمترین کتابخانه‌های جاوا اسکریپت
○ لایه‌های برنامه‌نویسی
○ PHP، پراستفاده‌ترین زبان برنامه‌نویسی وب
○ ASP.Net، زبان برنامه‌نویسی تحت وب مایکروسافت
○ Django یا جنگو، چارچوب برنامه‌نویسی تحت وب با استفاده از پایتون
○ JSP، نسخه مخصوص جاوا برای برنامه‌نویسی وب
○ جمع‌بندی کلی
🔸 می‌خواهم برنامه‌نویس وب شوم، از کجا باید شروع کنم؟
سؤال بالا، سوالی است که اکثر افراد هنگام شروع به یادگیری مباحث برنامه‌نویسی وب، با آن مواجه می‌شوند. اما به راستی، اگر بخواهیم برنامه‌نویسی وب را آغاز کنیم، باید از چه زبانی شروع کنیم؟ چه نکاتی باید رعایت شوند؟ ابتدا نیاز است تا چند مفهوم کاربردی را در زمینه برنامه‌نویسی وب، بررسی کنیم. در کل ۲ نوع وبسایت داریم، وب‌سایت‌های استاتیک یا ایستا و وب‌سایت‌های داینامیک یا پویا.
وب‌سایت‌های ایستا یا استاتیک، به وب‌سایت‌هایی گفته می‌شود که محتوا ثابت است و به منظور اضافه کردن محتوای جدید، می‌بایست مجدداً کدنویسی کرد. مثلاً شما یک وبسایت با ۵ صفحه دارید و به منظور اضافه کردن صفحه جدید، باید مجدداً کدنویسی کنید و سایر صفحات را نیز به منظور دسترسی به این صفحه ویرایش کرده و پیوند به این صفحه جدید را ایجاد کنید. به چنین وب‌سایت‌هایی، وبسایت ایستا گفته می‌شود.
وب‌سایت‌های پویا، در مقابل وب‌سایت‌های ایستا قرار دارند و کار با این نوع وب‌سایت‌ها، به مراتب آسان‌تر و همین‌طور بهتر است. در وب‌سایت‌های پویا، شما یک بار کدنویسی هسته را انجام می‌دهید و سپس به آسانی می‌توانید مطالب را منتشر کنید. به طور مثال، اگر با سرویس‌های بلاگ‌دهی کار کرده و آشنایی داشته باشید، می‌توانید سایتی طراحی کنید که با استفاده از پنل مدیریت، داده‌ها را دریافت کرده و به صورت پویا در سایت نمایش دهد و در صورت انتشار مطلب و محتوای جدید، احتیاجی به کدنویسی نباشد.
🔸 HTML، اولین زبان برنامه‌نویسی وب
HTML که سرواژه عبارت Hypertext Markup Language است، یک زبان نشانه‌گذاری محسوب می‌شود که به منظور ایجاد ساختار و قالب صفحه وب مورد استفاده قرار می‌گیرد. به کمک HTML می‌توانید مشخص کنید که در صفحه وب خود چند بخش دارید و محتوای هر بخش را مشخص کنید. زبان HTML، جزء لاینفک برنامه‌نویسی وب است و شما هر سایتی که بخواهید طراحی کنید، به هر زبانی که باشد، باید با استفاده از HTML ساختار اولیه سایت خود را آماده کرده و سپس با استفاده از سایر زبان‌ها، کدنویسی دیگر بخش‌ها را انجام دهید. به طور مثال، می‌خواهید مشخص کنید که سایت شما ۴ قسمت با عناوین سربرگ، ستون کناری، کادر محتوا و پاصفحه داشته باشد. باید در ابتدای کار با استفاده از HTML این قسمت را ایجاد و تعریف کنید و سپس با استفاده از سایر زبان‌ها، کد‌نویسی‌های سایر بخش‌ها را انجام دهید.
– آموزش طراحی وب با HTML
مطالعه ادامه مطلب 👇👇
🔗 چگونه برنامه‌نویسی وب را شروع کنم؟ — کلیک کنید (+)
📌 کانال اختصاصی آموزشی طراحی و توسعه وب
آخرین مطالب علمی، مقالات رایگان و ویدئوهای آموزشی طراحی و توسعه وب را در کانال اختصاصی [@FaraWebDev] دنبال کنید. 👇
@FaraWebDev — مطالب و آموزش‌های طراحی و توسعه وب فرادرس
برای بسیاری از افراد این پرسش وجود دارد که چگونه می‌توانند برنامه‌نویس وب شوند و باید برنامه‌نویسی وب را از کجا شروع کنند. در این مطلب از مجله فرادرس، تلاش کرده‌ایم تا پاسخ‌هایی مناسب به سئوالاتی از این دست بدهیم.
══ فهرست مطالب ══
○ می‌خواهم برنامه‌نویس وب شوم، از کجا باید شروع کنم؟
○ HTML، اولین زبان برنامه‌نویسی وب
○ CSS، زبان مخصوص استایل‌دهی
○ جاوا اسکریپت، نخستین زبان اسکریپت‌نویسی تحت وب
○ jQuery، یکی از مهمترین کتابخانه‌های جاوا اسکریپت
○ لایه‌های برنامه‌نویسی
○ PHP، پراستفاده‌ترین زبان برنامه‌نویسی وب
○ ASP.Net، زبان برنامه‌نویسی تحت وب مایکروسافت
○ Django یا جنگو، چارچوب برنامه‌نویسی تحت وب با استفاده از پایتون
○ JSP، نسخه مخصوص جاوا برای برنامه‌نویسی وب
○ جمع‌بندی کلی
🔸 می‌خواهم برنامه‌نویس وب شوم، از کجا باید شروع کنم؟
سؤال بالا، سوالی است که اکثر افراد هنگام شروع به یادگیری مباحث برنامه‌نویسی وب، با آن مواجه می‌شوند. اما به راستی، اگر بخواهیم برنامه‌نویسی وب را آغاز کنیم، باید از چه زبانی شروع کنیم؟ چه نکاتی باید رعایت شوند؟ ابتدا نیاز است تا چند مفهوم کاربردی را در زمینه برنامه‌نویسی وب، بررسی کنیم. در کل ۲ نوع وبسایت داریم، وب‌سایت‌های استاتیک یا ایستا و وب‌سایت‌های داینامیک یا پویا.
وب‌سایت‌های ایستا یا استاتیک، به وب‌سایت‌هایی گفته می‌شود که محتوا ثابت است و به منظور اضافه کردن محتوای جدید، می‌بایست مجدداً کدنویسی کرد. مثلاً شما یک وبسایت با ۵ صفحه دارید و به منظور اضافه کردن صفحه جدید، باید مجدداً کدنویسی کنید و سایر صفحات را نیز به منظور دسترسی به این صفحه ویرایش کرده و پیوند به این صفحه جدید را ایجاد کنید. به چنین وب‌سایت‌هایی، وبسایت ایستا گفته می‌شود.
وب‌سایت‌های پویا، در مقابل وب‌سایت‌های ایستا قرار دارند و کار با این نوع وب‌سایت‌ها، به مراتب آسان‌تر و همین‌طور بهتر است. در وب‌سایت‌های پویا، شما یک بار کدنویسی هسته را انجام می‌دهید و سپس به آسانی می‌توانید مطالب را منتشر کنید. به طور مثال، اگر با سرویس‌های بلاگ‌دهی کار کرده و آشنایی داشته باشید، می‌توانید سایتی طراحی کنید که با استفاده از پنل مدیریت، داده‌ها را دریافت کرده و به صورت پویا در سایت نمایش دهد و در صورت انتشار مطلب و محتوای جدید، احتیاجی به کدنویسی نباشد.
🔸 HTML، اولین زبان برنامه‌نویسی وب
HTML که سرواژه عبارت Hypertext Markup Language است، یک زبان نشانه‌گذاری محسوب می‌شود که به منظور ایجاد ساختار و قالب صفحه وب مورد استفاده قرار می‌گیرد. به کمک HTML می‌توانید مشخص کنید که در صفحه وب خود چند بخش دارید و محتوای هر بخش را مشخص کنید. زبان HTML، جزء لاینفک برنامه‌نویسی وب است و شما هر سایتی که بخواهید طراحی کنید، به هر زبانی که باشد، باید با استفاده از HTML ساختار اولیه سایت خود را آماده کرده و سپس با استفاده از سایر زبان‌ها، کدنویسی دیگر بخش‌ها را انجام دهید. به طور مثال، می‌خواهید مشخص کنید که سایت شما ۴ قسمت با عناوین سربرگ، ستون کناری، کادر محتوا و پاصفحه داشته باشد. باید در ابتدای کار با استفاده از HTML این قسمت را ایجاد و تعریف کنید و سپس با استفاده از سایر زبان‌ها، کد‌نویسی‌های سایر بخش‌ها را انجام دهید.
– آموزش طراحی وب با HTML
مطالعه ادامه مطلب 👇👇
🔗 چگونه برنامه‌نویسی وب را شروع کنم؟ — کلیک کنید (+)
📌 کانال اختصاصی آموزشی طراحی و توسعه وب
آخرین مطالب علمی، مقالات رایگان و ویدئوهای آموزشی طراحی و توسعه وب را در کانال اختصاصی [@FaraWebDev] دنبال کنید. 👇
@FaraWebDev — مطالب و آموزش‌های طراحی و توسعه وب فرادرس
✳️ مقدمه‌ای بر تئوری رنگ برای طراحان وب — یک راهنمای جامع
در این نوشته قصد داریم در خصوص اهمیت رنگ در طراحی وب و چگونگی انتخاب یک طرح رنگ خوشایند صحبت کنیم. این مقاله بخشی از سری مطالب مقدماتی فرادرس در این خصوص است که با هدف ارائه توضیحات عملی و فشرده در مورد مفاهیم طراحی برای افرادی که تجربه کمی در این خصوص دارند، ارائه شده است.
══ فهرست مطالب ══
○ این مقاله برای چه کسانی مناسب است؟
○ برخی از مخاطبان این راهنما
○ تئوری رنگ به طور خیلی خلاصه چیست؟
○ چگونه می‌توانیم یک طرح رنگی مؤثر انتخاب کنیم؟
○ این تنها آغاز راه است…
○ روش‌هایی برای آسان‌تر ساختن امور
○ مطالعه موردی: Gamers With Jobs
○ نکات پایانی و جمع‌بندی
🔸 این مقاله برای چه کسانی مناسب است؟
این راهنما برای افرادی مناسب است که به تازگی شروع به یادگیری مفاهیم طراحی رسمی نموده‌اند. در این راهنما قصد نداریم شیوه استفاده از رنگ در طراحی را به طور کامل توضیح دهیم؛ بلکه مروی کلی بر این مفاهیم خواهیم داشت. این راهنما برای کسانی ارائه می‌شود که به دنبال یک راهنمای عملی برای اتخاذ یک رویکرد عملی به تئوری رنگ در چارچوب پروژه‌های طراحی وب هستند.
یکی از دلایل تدوین این مقاله آن بوده است که تصمیم‌گیری در مورد انتخاب یک طرح رنگ که برای پروژه‌ای مناسب باشد، غالباً کاری دشوار محسوب می‌شود و احتمالاً یکی از دشوارترین تصمیم‌هایی است که یک طراح باید بگیرد. با این وجود با یادگیری اصول ابتدایی تئوری رنگ و برخی ابزارهای عالی که در وب وجود دارند، می‌توانید طراحی‌های قوی‌تری داشته باشید و این نقطه ضعف خود را بپوشانید.
🔸 برخی از مخاطبان این راهنما
– برنامه‌نویسانی که به دنبال توصیه‌هایی برای کمک به طراحی یک پروتوتایپ جذاب از نظر دیداری هستند.
– طراحان علاقه‌مندی که می‌خواهند مروری کوتاه بر موضوع داشته باشند.
– افرادی که تفاوت بین توسعه وب و طراحی وب را نمی‌دانند.
مطالعه ادامه مطلب 👇👇
🔗 مقدمه‌ای بر تئوری رنگ برای طراحان وب — یک راهنمای جامع — کلیک کنید (+)
📌 کانال اختصاصی آموزشی طراحی و توسعه وب
آخرین مطالب علمی، مقالات رایگان و ویدئوهای آموزشی طراحی و توسعه وب را در کانال اختصاصی [@FaraWebDev] دنبال کنید. 👇
@FaraWebDev — مطالب و آموزش‌های طراحی و توسعه وب فرادرس
در این نوشته قصد داریم در خصوص اهمیت رنگ در طراحی وب و چگونگی انتخاب یک طرح رنگ خوشایند صحبت کنیم. این مقاله بخشی از سری مطالب مقدماتی فرادرس در این خصوص است که با هدف ارائه توضیحات عملی و فشرده در مورد مفاهیم طراحی برای افرادی که تجربه کمی در این خصوص دارند، ارائه شده است.
══ فهرست مطالب ══
○ این مقاله برای چه کسانی مناسب است؟
○ برخی از مخاطبان این راهنما
○ تئوری رنگ به طور خیلی خلاصه چیست؟
○ چگونه می‌توانیم یک طرح رنگی مؤثر انتخاب کنیم؟
○ این تنها آغاز راه است…
○ روش‌هایی برای آسان‌تر ساختن امور
○ مطالعه موردی: Gamers With Jobs
○ نکات پایانی و جمع‌بندی
🔸 این مقاله برای چه کسانی مناسب است؟
این راهنما برای افرادی مناسب است که به تازگی شروع به یادگیری مفاهیم طراحی رسمی نموده‌اند. در این راهنما قصد نداریم شیوه استفاده از رنگ در طراحی را به طور کامل توضیح دهیم؛ بلکه مروی کلی بر این مفاهیم خواهیم داشت. این راهنما برای کسانی ارائه می‌شود که به دنبال یک راهنمای عملی برای اتخاذ یک رویکرد عملی به تئوری رنگ در چارچوب پروژه‌های طراحی وب هستند.
یکی از دلایل تدوین این مقاله آن بوده است که تصمیم‌گیری در مورد انتخاب یک طرح رنگ که برای پروژه‌ای مناسب باشد، غالباً کاری دشوار محسوب می‌شود و احتمالاً یکی از دشوارترین تصمیم‌هایی است که یک طراح باید بگیرد. با این وجود با یادگیری اصول ابتدایی تئوری رنگ و برخی ابزارهای عالی که در وب وجود دارند، می‌توانید طراحی‌های قوی‌تری داشته باشید و این نقطه ضعف خود را بپوشانید.
🔸 برخی از مخاطبان این راهنما
– برنامه‌نویسانی که به دنبال توصیه‌هایی برای کمک به طراحی یک پروتوتایپ جذاب از نظر دیداری هستند.
– طراحان علاقه‌مندی که می‌خواهند مروری کوتاه بر موضوع داشته باشند.
– افرادی که تفاوت بین توسعه وب و طراحی وب را نمی‌دانند.
مطالعه ادامه مطلب 👇👇
🔗 مقدمه‌ای بر تئوری رنگ برای طراحان وب — یک راهنمای جامع — کلیک کنید (+)
📌 کانال اختصاصی آموزشی طراحی و توسعه وب
آخرین مطالب علمی، مقالات رایگان و ویدئوهای آموزشی طراحی و توسعه وب را در کانال اختصاصی [@FaraWebDev] دنبال کنید. 👇
@FaraWebDev — مطالب و آموزش‌های طراحی و توسعه وب فرادرس
✳️ ۸ ابزار مهم CSS که هر توسعه دهنده وب باید بشناسد — راهنمای کاربردی
CSS یکی از ارکان توسعه وب محسوب می‌شود. با این حال اغلب افراد آن را سردرگم‌کننده می‌پندارند. دلیل این امر آن است که در خصوص آن آموزش درستی ندیده‌اند و از این رو درک رفتار CSS را دشوار می‌دانند. در این مقاله به دو روش به ارتقای دانش شما در مورد CSS کمک می‌کنیم. ابتدا چند ابزار مهم CSS را بررسی و سپس با چند محیط تعاملی کدنویسی CSS آشنا خواهیم شد.
══ فهرست مطالب ══
○ ابزارهای آنلاین برای تولید CSS
○ ابزارهای آنلاین یادگیری CSS
○ سخن پایانی
🔸 ابزارهای آنلاین برای تولید CSS
در این بخش با ابزارهای آنلاین کدنویسی CSS آشنا می‌شویم.
این ابزار آنلاین بسیار ساده (+) کمک زیادی به آشنایی با کدنویسی CSS می‌کند. با استفاده از این ابزار می‌توانید عناصر خود را با یک UI ساده طراحی کنید و خروجی CSS به شما عرضه می‌شود. EnjoyCSS موجب تسهیل فرایند کارها به میزان زیادی می‌شود. همچنین موجب صرفه‌جویی در زمان و تلاش برای ایجاد استایل‌های پیچیده CSS می‌شود. بدین ترتیب برای ساخت CSS پیچیده نیاز به داشتن درک عمیقی از این زبان نیست. EnjoyCSS یک تولیدکننده CSS۳ پیشرفته است که امکان رها شدن از دشواری کدنویسی را فراهم می‌سازد.
این ابزار (+) به شما کمک می‌کند که کدهایی برای باکس‌های خاص ایجاد و اکسپورت کنید که فلش‌هایی در اطراف خود دارند. با این که نوشتن چنین کدی از صفر کار بسیار دشواری محسوب می‌شود، اما با بهره‌گیری از این ابزار این کار در طی چند کلیک انجام می‌یابد. زمانی که کد را به دست آورید، می‌توانید با کمی تغییرات مانند افزودن سایه و غیره آن را مطابق میل خود بسازید.
🔸 ابزارهای آنلاین یادگیری CSS
در این بخش با چهار ابزار آنلاین برای یادگیری CSS آشنا خواهیم شد.
این وبسایت (+) به شما امکان می‌دهد که از یک دوره آموزشی کوتاه چهارساعته برای درک CSS Grid از صفر تا صد استفاده کنید. این دوره آموزشی کاملاً رایگان و شامل ۲۵ ویدئو است که گرید CSS را از صفر تا صد آموزش می‌دهد.
این بازی تعاملی (+) از شما می‌خواهد که کد CSS برای رشد باغچه هویج بنویسید. این روش جالب یادگیری تضمین می‌کند که با مبانی CSS Grid به روشی سرگرم‌کننده آشنا می‌شوید. این بازی شامل ۲۸ سطح است که هر سطح نیازمند نوشتن قطعه کدهای CSS برای برآورده ساختن نیازها است.
مطالعه ادامه مطلب 👇👇
🔗 ۸ ابزار مهم CSS که هر توسعه دهنده وب باید بشناسد — راهنمای کاربردی — کلیک کنید (+)
📌 کانال اختصاصی آموزشی طراحی و توسعه وب
آخرین مطالب علمی، مقالات رایگان و ویدئوهای آموزشی طراحی و توسعه وب را در کانال اختصاصی [@FaraWebDev] دنبال کنید. 👇
@FaraWebDev — مطالب و آموزش‌های طراحی و توسعه وب فرادرس
CSS یکی از ارکان توسعه وب محسوب می‌شود. با این حال اغلب افراد آن را سردرگم‌کننده می‌پندارند. دلیل این امر آن است که در خصوص آن آموزش درستی ندیده‌اند و از این رو درک رفتار CSS را دشوار می‌دانند. در این مقاله به دو روش به ارتقای دانش شما در مورد CSS کمک می‌کنیم. ابتدا چند ابزار مهم CSS را بررسی و سپس با چند محیط تعاملی کدنویسی CSS آشنا خواهیم شد.
══ فهرست مطالب ══
○ ابزارهای آنلاین برای تولید CSS
○ ابزارهای آنلاین یادگیری CSS
○ سخن پایانی
🔸 ابزارهای آنلاین برای تولید CSS
در این بخش با ابزارهای آنلاین کدنویسی CSS آشنا می‌شویم.
این ابزار آنلاین بسیار ساده (+) کمک زیادی به آشنایی با کدنویسی CSS می‌کند. با استفاده از این ابزار می‌توانید عناصر خود را با یک UI ساده طراحی کنید و خروجی CSS به شما عرضه می‌شود. EnjoyCSS موجب تسهیل فرایند کارها به میزان زیادی می‌شود. همچنین موجب صرفه‌جویی در زمان و تلاش برای ایجاد استایل‌های پیچیده CSS می‌شود. بدین ترتیب برای ساخت CSS پیچیده نیاز به داشتن درک عمیقی از این زبان نیست. EnjoyCSS یک تولیدکننده CSS۳ پیشرفته است که امکان رها شدن از دشواری کدنویسی را فراهم می‌سازد.
این ابزار (+) به شما کمک می‌کند که کدهایی برای باکس‌های خاص ایجاد و اکسپورت کنید که فلش‌هایی در اطراف خود دارند. با این که نوشتن چنین کدی از صفر کار بسیار دشواری محسوب می‌شود، اما با بهره‌گیری از این ابزار این کار در طی چند کلیک انجام می‌یابد. زمانی که کد را به دست آورید، می‌توانید با کمی تغییرات مانند افزودن سایه و غیره آن را مطابق میل خود بسازید.
🔸 ابزارهای آنلاین یادگیری CSS
در این بخش با چهار ابزار آنلاین برای یادگیری CSS آشنا خواهیم شد.
این وبسایت (+) به شما امکان می‌دهد که از یک دوره آموزشی کوتاه چهارساعته برای درک CSS Grid از صفر تا صد استفاده کنید. این دوره آموزشی کاملاً رایگان و شامل ۲۵ ویدئو است که گرید CSS را از صفر تا صد آموزش می‌دهد.
این بازی تعاملی (+) از شما می‌خواهد که کد CSS برای رشد باغچه هویج بنویسید. این روش جالب یادگیری تضمین می‌کند که با مبانی CSS Grid به روشی سرگرم‌کننده آشنا می‌شوید. این بازی شامل ۲۸ سطح است که هر سطح نیازمند نوشتن قطعه کدهای CSS برای برآورده ساختن نیازها است.
مطالعه ادامه مطلب 👇👇
🔗 ۸ ابزار مهم CSS که هر توسعه دهنده وب باید بشناسد — راهنمای کاربردی — کلیک کنید (+)
📌 کانال اختصاصی آموزشی طراحی و توسعه وب
آخرین مطالب علمی، مقالات رایگان و ویدئوهای آموزشی طراحی و توسعه وب را در کانال اختصاصی [@FaraWebDev] دنبال کنید. 👇
@FaraWebDev — مطالب و آموزش‌های طراحی و توسعه وب فرادرس
✳️ چگونه برنامه‌نویسی وب را شروع کنم؟
برای بسیاری از افراد این پرسش وجود دارد که چگونه می‌توانند برنامه‌نویس وب شوند و باید برنامه‌نویسی وب را از کجا شروع کنند. در این مطلب از مجله فرادرس، تلاش کرده‌ایم تا پاسخ‌هایی مناسب به سئوالاتی از این دست بدهیم.
══ فهرست مطالب ══
○ می‌خواهم برنامه‌نویس وب شوم، از کجا باید شروع کنم؟
○ HTML، اولین زبان برنامه‌نویسی وب
○ CSS، زبان مخصوص استایل‌دهی
○ جاوا اسکریپت، نخستین زبان اسکریپت‌نویسی تحت وب
○ jQuery، یکی از مهمترین کتابخانه‌های جاوا اسکریپت
○ لایه‌های برنامه‌نویسی
○ PHP، پراستفاده‌ترین زبان برنامه‌نویسی وب
○ ASP.Net، زبان برنامه‌نویسی تحت وب مایکروسافت
○ Django یا جنگو، چارچوب برنامه‌نویسی تحت وب با استفاده از پایتون
○ JSP، نسخه مخصوص جاوا برای برنامه‌نویسی وب
○ جمع‌بندی کلی
🔸 می‌خواهم برنامه‌نویس وب شوم، از کجا باید شروع کنم؟
سؤال بالا، سوالی است که اکثر افراد هنگام شروع به یادگیری مباحث برنامه‌نویسی وب، با آن مواجه می‌شوند. اما به راستی، اگر بخواهیم برنامه‌نویسی وب را آغاز کنیم، باید از چه زبانی شروع کنیم؟ چه نکاتی باید رعایت شوند؟ ابتدا نیاز است تا چند مفهوم کاربردی را در زمینه برنامه‌نویسی وب، بررسی کنیم. در کل ۲ نوع وبسایت داریم، وب‌سایت‌های استاتیک یا ایستا و وب‌سایت‌های داینامیک یا پویا.
وب‌سایت‌های ایستا یا استاتیک، به وب‌سایت‌هایی گفته می‌شود که محتوا ثابت است و به منظور اضافه کردن محتوای جدید، می‌بایست مجدداً کدنویسی کرد. مثلاً شما یک وبسایت با ۵ صفحه دارید و به منظور اضافه کردن صفحه جدید، باید مجدداً کدنویسی کنید و سایر صفحات را نیز به منظور دسترسی به این صفحه ویرایش کرده و پیوند به این صفحه جدید را ایجاد کنید. به چنین وب‌سایت‌هایی، وبسایت ایستا گفته می‌شود.
وب‌سایت‌های پویا، در مقابل وب‌سایت‌های ایستا قرار دارند و کار با این نوع وب‌سایت‌ها، به مراتب آسان‌تر و همین‌طور بهتر است. در وب‌سایت‌های پویا، شما یک بار کدنویسی هسته را انجام می‌دهید و سپس به آسانی می‌توانید مطالب را منتشر کنید. به طور مثال، اگر با سرویس‌های بلاگ‌دهی کار کرده و آشنایی داشته باشید، می‌توانید سایتی طراحی کنید که با استفاده از پنل مدیریت، داده‌ها را دریافت کرده و به صورت پویا در سایت نمایش دهد و در صورت انتشار مطلب و محتوای جدید، احتیاجی به کدنویسی نباشد.
🔸 HTML، اولین زبان برنامه‌نویسی وب
HTML که سرواژه عبارت Hypertext Markup Language است، یک زبان نشانه‌گذاری محسوب می‌شود که به منظور ایجاد ساختار و قالب صفحه وب مورد استفاده قرار می‌گیرد. به کمک HTML می‌توانید مشخص کنید که در صفحه وب خود چند بخش دارید و محتوای هر بخش را مشخص کنید. زبان HTML، جزء لاینفک برنامه‌نویسی وب است و شما هر سایتی که بخواهید طراحی کنید، به هر زبانی که باشد، باید با استفاده از HTML ساختار اولیه سایت خود را آماده کرده و سپس با استفاده از سایر زبان‌ها، کدنویسی دیگر بخش‌ها را انجام دهید. به طور مثال، می‌خواهید مشخص کنید که سایت شما ۴ قسمت با عناوین سربرگ، ستون کناری، کادر محتوا و پاصفحه داشته باشد. باید در ابتدای کار با استفاده از HTML این قسمت را ایجاد و تعریف کنید و سپس با استفاده از سایر زبان‌ها، کد‌نویسی‌های سایر بخش‌ها را انجام دهید.
– آموزش طراحی وب با HTML
مطالعه ادامه مطلب 👇👇
🔗 چگونه برنامه‌نویسی وب را شروع کنم؟ — کلیک کنید (+)
📌 کانال اختصاصی آموزشی طراحی و توسعه وب
آخرین مطالب علمی، مقالات رایگان و ویدئوهای آموزشی طراحی و توسعه وب را در کانال اختصاصی [@FaraWebDev] دنبال کنید. 👇
@FaraWebDev — مطالب و آموزش‌های طراحی و توسعه وب فرادرس
برای بسیاری از افراد این پرسش وجود دارد که چگونه می‌توانند برنامه‌نویس وب شوند و باید برنامه‌نویسی وب را از کجا شروع کنند. در این مطلب از مجله فرادرس، تلاش کرده‌ایم تا پاسخ‌هایی مناسب به سئوالاتی از این دست بدهیم.
══ فهرست مطالب ══
○ می‌خواهم برنامه‌نویس وب شوم، از کجا باید شروع کنم؟
○ HTML، اولین زبان برنامه‌نویسی وب
○ CSS، زبان مخصوص استایل‌دهی
○ جاوا اسکریپت، نخستین زبان اسکریپت‌نویسی تحت وب
○ jQuery، یکی از مهمترین کتابخانه‌های جاوا اسکریپت
○ لایه‌های برنامه‌نویسی
○ PHP، پراستفاده‌ترین زبان برنامه‌نویسی وب
○ ASP.Net، زبان برنامه‌نویسی تحت وب مایکروسافت
○ Django یا جنگو، چارچوب برنامه‌نویسی تحت وب با استفاده از پایتون
○ JSP، نسخه مخصوص جاوا برای برنامه‌نویسی وب
○ جمع‌بندی کلی
🔸 می‌خواهم برنامه‌نویس وب شوم، از کجا باید شروع کنم؟
سؤال بالا، سوالی است که اکثر افراد هنگام شروع به یادگیری مباحث برنامه‌نویسی وب، با آن مواجه می‌شوند. اما به راستی، اگر بخواهیم برنامه‌نویسی وب را آغاز کنیم، باید از چه زبانی شروع کنیم؟ چه نکاتی باید رعایت شوند؟ ابتدا نیاز است تا چند مفهوم کاربردی را در زمینه برنامه‌نویسی وب، بررسی کنیم. در کل ۲ نوع وبسایت داریم، وب‌سایت‌های استاتیک یا ایستا و وب‌سایت‌های داینامیک یا پویا.
وب‌سایت‌های ایستا یا استاتیک، به وب‌سایت‌هایی گفته می‌شود که محتوا ثابت است و به منظور اضافه کردن محتوای جدید، می‌بایست مجدداً کدنویسی کرد. مثلاً شما یک وبسایت با ۵ صفحه دارید و به منظور اضافه کردن صفحه جدید، باید مجدداً کدنویسی کنید و سایر صفحات را نیز به منظور دسترسی به این صفحه ویرایش کرده و پیوند به این صفحه جدید را ایجاد کنید. به چنین وب‌سایت‌هایی، وبسایت ایستا گفته می‌شود.
وب‌سایت‌های پویا، در مقابل وب‌سایت‌های ایستا قرار دارند و کار با این نوع وب‌سایت‌ها، به مراتب آسان‌تر و همین‌طور بهتر است. در وب‌سایت‌های پویا، شما یک بار کدنویسی هسته را انجام می‌دهید و سپس به آسانی می‌توانید مطالب را منتشر کنید. به طور مثال، اگر با سرویس‌های بلاگ‌دهی کار کرده و آشنایی داشته باشید، می‌توانید سایتی طراحی کنید که با استفاده از پنل مدیریت، داده‌ها را دریافت کرده و به صورت پویا در سایت نمایش دهد و در صورت انتشار مطلب و محتوای جدید، احتیاجی به کدنویسی نباشد.
🔸 HTML، اولین زبان برنامه‌نویسی وب
HTML که سرواژه عبارت Hypertext Markup Language است، یک زبان نشانه‌گذاری محسوب می‌شود که به منظور ایجاد ساختار و قالب صفحه وب مورد استفاده قرار می‌گیرد. به کمک HTML می‌توانید مشخص کنید که در صفحه وب خود چند بخش دارید و محتوای هر بخش را مشخص کنید. زبان HTML، جزء لاینفک برنامه‌نویسی وب است و شما هر سایتی که بخواهید طراحی کنید، به هر زبانی که باشد، باید با استفاده از HTML ساختار اولیه سایت خود را آماده کرده و سپس با استفاده از سایر زبان‌ها، کدنویسی دیگر بخش‌ها را انجام دهید. به طور مثال، می‌خواهید مشخص کنید که سایت شما ۴ قسمت با عناوین سربرگ، ستون کناری، کادر محتوا و پاصفحه داشته باشد. باید در ابتدای کار با استفاده از HTML این قسمت را ایجاد و تعریف کنید و سپس با استفاده از سایر زبان‌ها، کد‌نویسی‌های سایر بخش‌ها را انجام دهید.
– آموزش طراحی وب با HTML
مطالعه ادامه مطلب 👇👇
🔗 چگونه برنامه‌نویسی وب را شروع کنم؟ — کلیک کنید (+)
📌 کانال اختصاصی آموزشی طراحی و توسعه وب
آخرین مطالب علمی، مقالات رایگان و ویدئوهای آموزشی طراحی و توسعه وب را در کانال اختصاصی [@FaraWebDev] دنبال کنید. 👇
@FaraWebDev — مطالب و آموزش‌های طراحی و توسعه وب فرادرس
✳️ برنامه نویسی وب با پایتون — راهنمای کاربردی
در این مطلب، با ابزارهای لازم برای برنامه نویسی وب در پایتون آشنا خواهید شد. در مرحله اول، مهمترین ابزارها، «واسط‌های برنامه‌نویسی کاربردی» (Application Programming Interface | API) و «کتابخانه‌ها» (Libraries) جهت برنامه‌نویسی وب معرفی خواهند شد. در مرحله بعد، برای نمایش چگونگی توسعه برنامه‌های کاربردی تحت وب، یک مثال کاربردی از برنامه نویسی وب با پایتون نمایش داده خواهد شد.
══ فهرست مطالب ══
○ پلتفرم توسعه تحت وب چیست؟
○ دلایل استفاده از پلتفرم‌های توسعه تحت وب
○ پلتفرم‌های مناسب برنامه نویسی وب با پایتون
○ نکاتی در مورد برنامه نویسی وب با پایتون
○ توسعه برنامه کاربردی تحت وب با پلتفرم Flask و Google App Engine
🔸 پلتفرم توسعه تحت وب چیست؟
پیش از معرفی ابزارهای و کتابخانه‌های توسعه داده شده جهت برنامه نویسی وب با پایتون، مفهوم پلتفرم توسعه تحت وب شرح داده خواهد شد. به پلتفرم‌های توسعه نرم‌افزاری که از مجموعه‌ای از ماژول‌ها و بسته‌های برنامه‌نویسی تحت وب تشکیل شده‌اند، پلتفرم‌های توسعه تحت وب گفته می‌شود. پلتفرم‌های توسعه تحت وب در پایتون، امکان برنامه نویسی وب با پایتون و توسعه برنامه‌کاربردی تحت وب را در این زبان برنامه‌نویسی محبوب فراهم می‌آورند.
پلتفرم‌های توسعه تحت وب، تمامی ارتباطات سطح پایین میان لایه برنامه کاربردی با لایه‌های سطوح پایین‌تر را از دید کاربر مخفی کنند و از این طریق، شرایط را برای توسعه موفق برنامه‌های کاربردی تحت وب و استفاده کاربران از امکانات آن‌ها فراهم می‌کنند. نکته شایان توجه در مورد پلتفرم‌های توسعه تحت وب این است که سطح مخفی شدن جزئیات سطح پایین از دید کاربران، بسته به پلتفرم‌های توسعه تحت وب مختلف، متفاوت است.
🔸 دلایل استفاده از پلتفرم‌های توسعه تحت وب
همیشه این امکان برای برنامه‌نویسان و توسعه دهندگان وب وجود دارد که برای توسعه برنامه کاربردی تحت وب خود در پایتون، از صفر تا صد در زبان برنامه‌نویسی پایتون کد نویسی انجام دهند. ولی دلایل مختلفی برای عدم اتخاذ چنین رویکردی وجود دارد. در ادامه، پنج دلیل مهم برای استفاده از پلتفرم‌های توسعه تحت وب جهت برنامه نویسی وب با پایتون ارائه شده است.
در حال حاضر، از پلتفرم‌های محبوب برنامه نویسی وب با پایتون نظیر Pyramid و Django، در شرکت‌های بزرگی نظیر Bitbucket ،Pinterest ،Instagram و Dropbox جهت توسعه برنامه‌های کاربردی تحت وب استفاده می‌شود. بنابراین، به‌راحتی می‌توان نتیجه گرفت که این پلتفرم‌ها توانایی مدیریت و اجرای تمامی فرایندهای توسعه برنامه‌های کاربردی تحت وب را دارند.
همانطور که پیش از این نیز اشاره شد، یکی از ویژگی‌های مهم پلتفرم‌های توسعه تحت وب، مخفی کردن جزئیات سطح پایین از دید کاربران است. چنین کاری به برنامه‌نویسان و توسعه‌دهندگان اجازه می‌دهد تا هنگام برنامه نویسی وب با پایتون، بدون درگیر شدن با جزئیات سطح پایین، به توسعه برنامه‌های کاربردی تحت وب مبادرت ورزند.
مطالعه ادامه مطلب 👇👇
🔗 برنامه نویسی وب با پایتون — راهنمای کاربردی — کلیک کنید (+)
📌 کانال اختصاصی آموزشی طراحی و توسعه وب
آخرین مطالب علمی، مقالات رایگان و ویدئوهای آموزشی طراحی و توسعه وب را در کانال اختصاصی [@FaraWebDev] دنبال کنید. 👇
@FaraWebDev — مطالب و آموزش‌های طراحی و توسعه وب فرادرس
در این مطلب، با ابزارهای لازم برای برنامه نویسی وب در پایتون آشنا خواهید شد. در مرحله اول، مهمترین ابزارها، «واسط‌های برنامه‌نویسی کاربردی» (Application Programming Interface | API) و «کتابخانه‌ها» (Libraries) جهت برنامه‌نویسی وب معرفی خواهند شد. در مرحله بعد، برای نمایش چگونگی توسعه برنامه‌های کاربردی تحت وب، یک مثال کاربردی از برنامه نویسی وب با پایتون نمایش داده خواهد شد.
══ فهرست مطالب ══
○ پلتفرم توسعه تحت وب چیست؟
○ دلایل استفاده از پلتفرم‌های توسعه تحت وب
○ پلتفرم‌های مناسب برنامه نویسی وب با پایتون
○ نکاتی در مورد برنامه نویسی وب با پایتون
○ توسعه برنامه کاربردی تحت وب با پلتفرم Flask و Google App Engine
🔸 پلتفرم توسعه تحت وب چیست؟
پیش از معرفی ابزارهای و کتابخانه‌های توسعه داده شده جهت برنامه نویسی وب با پایتون، مفهوم پلتفرم توسعه تحت وب شرح داده خواهد شد. به پلتفرم‌های توسعه نرم‌افزاری که از مجموعه‌ای از ماژول‌ها و بسته‌های برنامه‌نویسی تحت وب تشکیل شده‌اند، پلتفرم‌های توسعه تحت وب گفته می‌شود. پلتفرم‌های توسعه تحت وب در پایتون، امکان برنامه نویسی وب با پایتون و توسعه برنامه‌کاربردی تحت وب را در این زبان برنامه‌نویسی محبوب فراهم می‌آورند.
پلتفرم‌های توسعه تحت وب، تمامی ارتباطات سطح پایین میان لایه برنامه کاربردی با لایه‌های سطوح پایین‌تر را از دید کاربر مخفی کنند و از این طریق، شرایط را برای توسعه موفق برنامه‌های کاربردی تحت وب و استفاده کاربران از امکانات آن‌ها فراهم می‌کنند. نکته شایان توجه در مورد پلتفرم‌های توسعه تحت وب این است که سطح مخفی شدن جزئیات سطح پایین از دید کاربران، بسته به پلتفرم‌های توسعه تحت وب مختلف، متفاوت است.
🔸 دلایل استفاده از پلتفرم‌های توسعه تحت وب
همیشه این امکان برای برنامه‌نویسان و توسعه دهندگان وب وجود دارد که برای توسعه برنامه کاربردی تحت وب خود در پایتون، از صفر تا صد در زبان برنامه‌نویسی پایتون کد نویسی انجام دهند. ولی دلایل مختلفی برای عدم اتخاذ چنین رویکردی وجود دارد. در ادامه، پنج دلیل مهم برای استفاده از پلتفرم‌های توسعه تحت وب جهت برنامه نویسی وب با پایتون ارائه شده است.
در حال حاضر، از پلتفرم‌های محبوب برنامه نویسی وب با پایتون نظیر Pyramid و Django، در شرکت‌های بزرگی نظیر Bitbucket ،Pinterest ،Instagram و Dropbox جهت توسعه برنامه‌های کاربردی تحت وب استفاده می‌شود. بنابراین، به‌راحتی می‌توان نتیجه گرفت که این پلتفرم‌ها توانایی مدیریت و اجرای تمامی فرایندهای توسعه برنامه‌های کاربردی تحت وب را دارند.
همانطور که پیش از این نیز اشاره شد، یکی از ویژگی‌های مهم پلتفرم‌های توسعه تحت وب، مخفی کردن جزئیات سطح پایین از دید کاربران است. چنین کاری به برنامه‌نویسان و توسعه‌دهندگان اجازه می‌دهد تا هنگام برنامه نویسی وب با پایتون، بدون درگیر شدن با جزئیات سطح پایین، به توسعه برنامه‌های کاربردی تحت وب مبادرت ورزند.
مطالعه ادامه مطلب 👇👇
🔗 برنامه نویسی وب با پایتون — راهنمای کاربردی — کلیک کنید (+)
📌 کانال اختصاصی آموزشی طراحی و توسعه وب
آخرین مطالب علمی، مقالات رایگان و ویدئوهای آموزشی طراحی و توسعه وب را در کانال اختصاصی [@FaraWebDev] دنبال کنید. 👇
@FaraWebDev — مطالب و آموزش‌های طراحی و توسعه وب فرادرس
✳️ چگونه قالب وردپرس را ویرایش کنیم ؟ | کاربردی و به زبان ساده
اگر از یک قالب وردپرس استفاده می‌کنید که فکر می‌کنید چندان مناسب نیست، جای نگرانی وجود ندارد، چون گزینه‌های زیادی وجود دارند که با استفاده از آن‌ها می‌توانید قالب وردپرس را ادیت کنید. در این مطلب با روش ویرایش قالب یا پوسته وردپرس آشنا می‌شویم تا بتوانید آن را طوری ادیت کنید که با نیازها و خواسته‌های شما مطابقت پیدا کند. اگر به دنبال پاسخ این سؤال هستید که چگونه قالب وردپرس را ویرایش کنیم تا انتهای این مطلب با ما همراه باشید.
══ فهرست مطالب ══
○ چگونه قالب وردپرس را ویرایش کنیم ؟
○ آیا واقعاً به ویرایش قالب وردپرس نیاز داریم؟
○ سفارشی‌سازی قالب وردپرس با استفاده از قابلیت‌های بخش مدیریت وردپرس
○ ویرایش قالب وردپرس با ابزارهای صفحه‌ساز و فریمورکها
○ ویرایش کد قالب وردپرس
○ بهترین رویه‌های ویرایش قالب وردپرس
○ راهنمای عملی ویرایش قالب وردپرس
○ استفاده از تگ‌های شرطی در قالب‌های پیش‌فرض
○ ساخت فایل‌های برگه خاص در سلسله مراتب وردپرس
○ انتساب تمپلیت‌های صفحه سفارشی
○ راهنمای گام به گام ساخت قالب‌های برگه سفارشی وردپرس
○ پنج روش متفاوت برای استفاده تمپلیت‌های برگه
○ سخن پایانی
🔸 چگونه قالب وردپرس را ویرایش کنیم ؟
پیش از آن که وارد بحث ایجاد تغییر در قالب وردپرس شویم، بهتر است با همه گزینه‌هایی که به این منظور در اختیار داریم، آشنا شویم، چون هر یک از این ابزارها برای منظور متفاوتی مناسب هستند. در فهرست زیر گزینه‌های موجود برای ویرایش یک قالب وردپرس را جمع‌بندی کرده‌ایم.
– اگر می‌خواهید یک کارکرد را به قالب خود اضافه کنید، باید یک افزونه یا پلاگین نصب کنید.
– برای سفارشی‌سازی فونت، رنگ و حتی احتمالاً لی‌آوت صفحات بسته به این که از چه قالبی استفاده می‌کنید، می‌توانید از ابزار سفارشی‌سازی قالب که در داشبورد مدیریت وردپرس وجود دارد بهره بگیرید.
– اگر از یک قالب مجهز به «صفحه‌ساز» (page builder) استفاده می‌کنید، می‌توانید از قابلیت‌های آن برای سفارشی‌سازی طراحی سایت خود بهره بگیرید.
– اگر یک قالب فریمورکی روی وردپرس نصب کرده‌اید، می‌توانید از «قالب‌های فرزند» (child themes) آن برای سفارشی‌سازی سایت استفاده کنید و به همراه آن از هر نوع گزینه‌های سفارشی‌سازی که در داشبورد مدیریت سایت وجود دارد نیز بهره بگیرید.
– اگر قالب شما به طور اختصاصی برای سایت‌تان طراحی شده است و امکان ادیت کد آن را دارید، می‌توانید مستقیماً اقدام به ویرایش کد قالب بکنید.
– اگر می‌خواهید کد یک قالب شخص ثالث را ویرایش کنید، باید یک «قالب فرزند» ایجاد کنید.
اکنون که با همه گزینه‌های ویرایش قالب وردپرس آشنا شدید، اگر می‌خواهید کد قالب را ادیت کنید، چند گزینه مختلف از جمله «ویرایشگر بلوکی» (Block Editor)، «ابزار سفارشی‌سازی» (Customizer) و همچنین ویرایش مستقیم فایل‌های قالب وجود دارد. در ادامه این راهنما با همه این روش‌ها آشنا خواهیم شد، اما کار را با ساده‌ترین گزینه یعنی نصب پلاگین آغاز می‌کنیم.
🔸 آیا واقعاً به ویرایش قالب وردپرس نیاز داریم؟
گاهی اوقات ما واقعاً نیازی به ویرایش قالب سایت وردپرسی خود نداریم و کافی است یک پلاگین را نصب کنیم تا به کارکرد مورد نظرمان دسترسی داشته باشیم. قالب‌ها، طراحی سایت را تعیین می‌کنند و شیوه نمایش خود سایت و محتوای آن به وسیله قالب‌ها کنترل می‌شود. پلاگین‌ها کارکردهای اضافی را به سایت می‌بخشند.
اگر تغییرهایی که می‌خواهید روی سایت ایجاد کنید، بیشتر معطوف به کارکرد هستند تا طراحی، باید اقدام به نصب پلاگین بکنید. این پلاگین را می‌توانید خودتان بنویسید، از یک دایرکتوری پلاگین دانلود کنید و یا خریداری نمایید.
اگر بخواهید فایل functions.php مربوط به قالب را ویرایش کنید، باید ابتدا از خود بپرسید که آیا در صورت تغییر دادن قالب در آینده همچنان به این کارکرد نیاز خواهم داشت؟ اگر پاسخ این سؤال مثبت است، این کد باید به صورت یک پلاگین باشد و نباید درون قالب قرار گیرد.
مطالعه ادامه مطلب 👇👇
🔗 چگونه قالب وردپرس را ویرایش کنیم ؟ | کاربردی و به زبان ساده — کلیک کنید (+)
📌 کانال اختصاصی آموزشی طراحی و توسعه وب
آخرین مطالب علمی، مقالات رایگان و ویدئوهای آموزشی طراحی و توسعه وب را در کانال اختصاصی [@FaraWebDev] دنبال کنید. 👇
@FaraWebDev — مطالب و آموزش‌های طراحی و توسعه وب فرادرس
اگر از یک قالب وردپرس استفاده می‌کنید که فکر می‌کنید چندان مناسب نیست، جای نگرانی وجود ندارد، چون گزینه‌های زیادی وجود دارند که با استفاده از آن‌ها می‌توانید قالب وردپرس را ادیت کنید. در این مطلب با روش ویرایش قالب یا پوسته وردپرس آشنا می‌شویم تا بتوانید آن را طوری ادیت کنید که با نیازها و خواسته‌های شما مطابقت پیدا کند. اگر به دنبال پاسخ این سؤال هستید که چگونه قالب وردپرس را ویرایش کنیم تا انتهای این مطلب با ما همراه باشید.
══ فهرست مطالب ══
○ چگونه قالب وردپرس را ویرایش کنیم ؟
○ آیا واقعاً به ویرایش قالب وردپرس نیاز داریم؟
○ سفارشی‌سازی قالب وردپرس با استفاده از قابلیت‌های بخش مدیریت وردپرس
○ ویرایش قالب وردپرس با ابزارهای صفحه‌ساز و فریمورکها
○ ویرایش کد قالب وردپرس
○ بهترین رویه‌های ویرایش قالب وردپرس
○ راهنمای عملی ویرایش قالب وردپرس
○ استفاده از تگ‌های شرطی در قالب‌های پیش‌فرض
○ ساخت فایل‌های برگه خاص در سلسله مراتب وردپرس
○ انتساب تمپلیت‌های صفحه سفارشی
○ راهنمای گام به گام ساخت قالب‌های برگه سفارشی وردپرس
○ پنج روش متفاوت برای استفاده تمپلیت‌های برگه
○ سخن پایانی
🔸 چگونه قالب وردپرس را ویرایش کنیم ؟
پیش از آن که وارد بحث ایجاد تغییر در قالب وردپرس شویم، بهتر است با همه گزینه‌هایی که به این منظور در اختیار داریم، آشنا شویم، چون هر یک از این ابزارها برای منظور متفاوتی مناسب هستند. در فهرست زیر گزینه‌های موجود برای ویرایش یک قالب وردپرس را جمع‌بندی کرده‌ایم.
– اگر می‌خواهید یک کارکرد را به قالب خود اضافه کنید، باید یک افزونه یا پلاگین نصب کنید.
– برای سفارشی‌سازی فونت، رنگ و حتی احتمالاً لی‌آوت صفحات بسته به این که از چه قالبی استفاده می‌کنید، می‌توانید از ابزار سفارشی‌سازی قالب که در داشبورد مدیریت وردپرس وجود دارد بهره بگیرید.
– اگر از یک قالب مجهز به «صفحه‌ساز» (page builder) استفاده می‌کنید، می‌توانید از قابلیت‌های آن برای سفارشی‌سازی طراحی سایت خود بهره بگیرید.
– اگر یک قالب فریمورکی روی وردپرس نصب کرده‌اید، می‌توانید از «قالب‌های فرزند» (child themes) آن برای سفارشی‌سازی سایت استفاده کنید و به همراه آن از هر نوع گزینه‌های سفارشی‌سازی که در داشبورد مدیریت سایت وجود دارد نیز بهره بگیرید.
– اگر قالب شما به طور اختصاصی برای سایت‌تان طراحی شده است و امکان ادیت کد آن را دارید، می‌توانید مستقیماً اقدام به ویرایش کد قالب بکنید.
– اگر می‌خواهید کد یک قالب شخص ثالث را ویرایش کنید، باید یک «قالب فرزند» ایجاد کنید.
اکنون که با همه گزینه‌های ویرایش قالب وردپرس آشنا شدید، اگر می‌خواهید کد قالب را ادیت کنید، چند گزینه مختلف از جمله «ویرایشگر بلوکی» (Block Editor)، «ابزار سفارشی‌سازی» (Customizer) و همچنین ویرایش مستقیم فایل‌های قالب وجود دارد. در ادامه این راهنما با همه این روش‌ها آشنا خواهیم شد، اما کار را با ساده‌ترین گزینه یعنی نصب پلاگین آغاز می‌کنیم.
🔸 آیا واقعاً به ویرایش قالب وردپرس نیاز داریم؟
گاهی اوقات ما واقعاً نیازی به ویرایش قالب سایت وردپرسی خود نداریم و کافی است یک پلاگین را نصب کنیم تا به کارکرد مورد نظرمان دسترسی داشته باشیم. قالب‌ها، طراحی سایت را تعیین می‌کنند و شیوه نمایش خود سایت و محتوای آن به وسیله قالب‌ها کنترل می‌شود. پلاگین‌ها کارکردهای اضافی را به سایت می‌بخشند.
اگر تغییرهایی که می‌خواهید روی سایت ایجاد کنید، بیشتر معطوف به کارکرد هستند تا طراحی، باید اقدام به نصب پلاگین بکنید. این پلاگین را می‌توانید خودتان بنویسید، از یک دایرکتوری پلاگین دانلود کنید و یا خریداری نمایید.
اگر بخواهید فایل functions.php مربوط به قالب را ویرایش کنید، باید ابتدا از خود بپرسید که آیا در صورت تغییر دادن قالب در آینده همچنان به این کارکرد نیاز خواهم داشت؟ اگر پاسخ این سؤال مثبت است، این کد باید به صورت یک پلاگین باشد و نباید درون قالب قرار گیرد.
مطالعه ادامه مطلب 👇👇
🔗 چگونه قالب وردپرس را ویرایش کنیم ؟ | کاربردی و به زبان ساده — کلیک کنید (+)
📌 کانال اختصاصی آموزشی طراحی و توسعه وب
آخرین مطالب علمی، مقالات رایگان و ویدئوهای آموزشی طراحی و توسعه وب را در کانال اختصاصی [@FaraWebDev] دنبال کنید. 👇
@FaraWebDev — مطالب و آموزش‌های طراحی و توسعه وب فرادرس
✳️ کاربرد فونت آیکون در طراحی وب
══ فهرست مطالب ══
○ فونت آیکون چیست؟
○ Font Awesome، پرکاربردترین فونت آیکون ارائه شده
🔸 فونت آیکون چیست؟
فونت‌ها معمولاً شامل چندین عدد و همین‌طور حروف هستند که به کاربر این امکان را می‌دهند تا مشخص کند که متون موردنظر، با چه شکلی به کاربر نمایش داده شود. در کنار این نوع از فونت‌ها که به فونت‌های متنی نیز معروف هستند، فونت آیکون‌ها نیز وجود دارند. فونت آیکون، فونتی است که بجای اینکه شامل چندین حرف و متن باشد، شامل اشکال مختلفی است که می‌توان از آن‌ها استفاده کرد. شما می‌توانید به استفاده از فونت آیکون، در قسمت‌های موردنظر از آیکون‌هایی که در داخل فونت تعبیه‌شده است استفاده کنید و اشکال موردنظر را با ابعاد موردنظر در سایت خود درج نمایید.
استفاده از فونت آیکون‌ها، مزایا و معایبی دارد که در ادامه به آن‌ها خواهیم پرداخت:
مزایا:
🔸 Font Awesome، پرکاربردترین فونت آیکون ارائه شده
فونت آیکون Font Awesome را می‌توان پرکاربردترین فونت آیکون ارائه‌شده دانست که شامل ۵۸۵ آیکون می‌باشد و در دسته‌بندی‌هایی نظیر طراحی وب، شبکه‌های اجتماعی، نمودار و چارت آیکون‌های پرداخت و … دسته‌بندی شده‌اند. Font Awesome به‌صورت متن‌باز، در گیت هاب در این لینک (+) در دسترس می‌باشد و شما می‌توانید این فونت آیکون را دانلود کرده و در پروژه‌های خود از آن استفاده کنید.
نحوه فراخوانی در وبسایت نیز بسیار ساده است. کافی است تا فونت آیکون را مانند سایر فونت‌ها، در فایل Style.css خود الحاق کنید. بعد از فراخوانی و الحاق فونت‌ها، کافی است تا آیکون موردنظر خود را از این لینک (+) انتخاب کرده و بر روی آیکون موردنظر کلیک کنید تا کد مربوط به فراخوانی آیکون مربوطه نمایش دهد. سپس کد را در هر قسمت که مدنظر دارید، کپی کرده و از آیکون موردنظر استفاده کنید.
این فونت آیکون در بازه‌های زمانی مختلفی به‌روزرسانی شده و آیکون‌های جدیدی به آن اضافه می‌شود که همواره می‌توانید از این آیکون‌ها استفاده کنید. درصورتی‌که می‌خواهید طراحی وب را شروع کنید و یا مایل به یادگیری مباحث بیشتری دارید، آموزش‌های زیر را پیشنهاد می‌کنیم:
مطالعه ادامه مطلب 👇👇
🔗 کاربرد فونت آیکون در طراحی وب — کلیک کنید (+)
📌 کانال اختصاصی آموزشی طراحی و توسعه وب
آخرین مطالب علمی، مقالات رایگان و ویدئوهای آموزشی طراحی و توسعه وب را در کانال اختصاصی [@FaraWebDev] دنبال کنید. 👇
@FaraWebDev — مطالب و آموزش‌های طراحی و توسعه وب فرادرس
══ فهرست مطالب ══
○ فونت آیکون چیست؟
○ Font Awesome، پرکاربردترین فونت آیکون ارائه شده
🔸 فونت آیکون چیست؟
فونت‌ها معمولاً شامل چندین عدد و همین‌طور حروف هستند که به کاربر این امکان را می‌دهند تا مشخص کند که متون موردنظر، با چه شکلی به کاربر نمایش داده شود. در کنار این نوع از فونت‌ها که به فونت‌های متنی نیز معروف هستند، فونت آیکون‌ها نیز وجود دارند. فونت آیکون، فونتی است که بجای اینکه شامل چندین حرف و متن باشد، شامل اشکال مختلفی است که می‌توان از آن‌ها استفاده کرد. شما می‌توانید به استفاده از فونت آیکون، در قسمت‌های موردنظر از آیکون‌هایی که در داخل فونت تعبیه‌شده است استفاده کنید و اشکال موردنظر را با ابعاد موردنظر در سایت خود درج نمایید.
استفاده از فونت آیکون‌ها، مزایا و معایبی دارد که در ادامه به آن‌ها خواهیم پرداخت:
مزایا:
🔸 Font Awesome، پرکاربردترین فونت آیکون ارائه شده
فونت آیکون Font Awesome را می‌توان پرکاربردترین فونت آیکون ارائه‌شده دانست که شامل ۵۸۵ آیکون می‌باشد و در دسته‌بندی‌هایی نظیر طراحی وب، شبکه‌های اجتماعی، نمودار و چارت آیکون‌های پرداخت و … دسته‌بندی شده‌اند. Font Awesome به‌صورت متن‌باز، در گیت هاب در این لینک (+) در دسترس می‌باشد و شما می‌توانید این فونت آیکون را دانلود کرده و در پروژه‌های خود از آن استفاده کنید.
نحوه فراخوانی در وبسایت نیز بسیار ساده است. کافی است تا فونت آیکون را مانند سایر فونت‌ها، در فایل Style.css خود الحاق کنید. بعد از فراخوانی و الحاق فونت‌ها، کافی است تا آیکون موردنظر خود را از این لینک (+) انتخاب کرده و بر روی آیکون موردنظر کلیک کنید تا کد مربوط به فراخوانی آیکون مربوطه نمایش دهد. سپس کد را در هر قسمت که مدنظر دارید، کپی کرده و از آیکون موردنظر استفاده کنید.
این فونت آیکون در بازه‌های زمانی مختلفی به‌روزرسانی شده و آیکون‌های جدیدی به آن اضافه می‌شود که همواره می‌توانید از این آیکون‌ها استفاده کنید. درصورتی‌که می‌خواهید طراحی وب را شروع کنید و یا مایل به یادگیری مباحث بیشتری دارید، آموزش‌های زیر را پیشنهاد می‌کنیم:
مطالعه ادامه مطلب 👇👇
🔗 کاربرد فونت آیکون در طراحی وب — کلیک کنید (+)
📌 کانال اختصاصی آموزشی طراحی و توسعه وب
آخرین مطالب علمی، مقالات رایگان و ویدئوهای آموزشی طراحی و توسعه وب را در کانال اختصاصی [@FaraWebDev] دنبال کنید. 👇
@FaraWebDev — مطالب و آموزش‌های طراحی و توسعه وب فرادرس
✳️ کاربرد رنگ در طراحی وب — ۶ توصیه برای طراحی مطمئن وبسایت
احتمالاً همه ما خاطراتی از نخستین روزهای آموزش خود به یاد داریم که در کلاس نقاشی، رنگ‌های مختلف در اختیار ما قرار می‌گرفت. برای نخستین بار شاهد بودیم که چگونه رنگ‌های اصلی در ترکیب با هم رنگ‌های ثانویه را می‌سازند و شاید با خودمان استدلال کرده‌ایم که اگر ترکیب دو رنگ باعث پدید آمدن چنین رنگ زیبایی شده است، پس ترکیب کردن همه رنگ‌ها با هم حتماً چیز بهتری خواهد ساخت! اما درک این نکته که مخلوط کردن همه رنگ‌ها با هم صرف‌نظر از شیوه اجرا، نتیجه‌ای نازیبا به بار می‌آورد، تجربه‌ای کاملاً مأیوس‌کننده بوده است.
══ فهرست مطالب ══
○ مقدمه‌ای بر تئوری رنگ
○ ۱. طرح رنگ نقاشی نیست؛ بلکه بوم است
○ ۲. با یک مبنای ساده خاکستری شروع کنید
○ ۳. برای هایلایت کردن تنها از یک رنگ استفاده کنید
○ ۴. اگر تردید دارید، از رنگ آبی استفاده کنید
○ ۵. از نسخه‌های مختلف رنگ هایلایت استفاده کنید
○ ۶. از گوشه راست-بالای نقشه رنگ اجتناب کنید
○ نکات مهم دیگر
○ سخن پایانی
🔸 مقدمه‌ای بر تئوری رنگ
در بلاگ فرادرس قبلاً در مورد طرح‌های رنگ بسیار صحبت کردیم و اطلاعاتی جذاب در مورد نظریه رنگ آموختیم. در مورد رنگ مایه، سایه‌روشن رنگ، تن رنگ، و اشباع و درخشش رنگ مطالبی خواندیم. همچنین طرح‌های رنگی متشابه، مونوکروم، سه‌گانه، مکمل و ترکیبی را معرفی کردیم.
اما بدون وجود یک چارچوب عملی برای استفاده از این اطلاعات، نمی‌توانید به ایجاد یک وبسایت با طراحی خوش رنگ نزدیک شوید. در واقع صرفاً با استفاده از تمرین ایجاد طرح‌های رنگی با آزمون و خطا است که می‌توانید به همه آن چه در مورد تئوری رنگ آموخته‌اید، معنایی عملی ببخشید.
در این فرایند برخی توصیه‌های کاربردی برای طرح‌های رنگ وب‌سایت‌ها وجود دارند که شاید افراد مبتدی از آن‌ها مطلع نباشند. زمانی که هنوز در ابتدای کار هستید، نظریه رنگ تنها چیزی نیست که با آن مواجه می‌شوید. در واقع در این زمان شما به چیزی نیاز دارید که جنبه تئوریک کمتری داشته باشد و راهنمای سرراست‌تری باشد.
🔸 ۱. طرح رنگ نقاشی نیست؛ بلکه بوم است
یکی از بنیادی‌ترین مفاهیم در طراحی وب آن است که مهم نیست چقدر زمان صرف طراحی یک طرح رنگ درخشان کرده باشید، در نهایت وظیفه آن این است که نقش دوم این نمایش باشد؛ چون نقش اول نمایش، محتوای وبسایت است. طرح رنگ شما نباید طوری باشد که درخشان‌تر از محتوای وبسایت به چشم بیاید. طراحی خوب آن طراحی است که در پس‌زمینه بماند و به ارائه بهتر محتوا در پیش‌زمینه کمک کند.
یکی از متداول‌ترین فرایندها در طراحی وب این است که خود طراحی در روندی تقریباً جداگانه و غالباً در نرم‌افزارهایی مانند فتوشاپ یا Sketch خلق می‌شود. اگر به محتوای نمونه وبسایت دسترسی نداشته باشید، احتمال این که طراحی ایجاد شده، خود به تنهایی عالی به نظر بیاید بیشتر می‌شود. ممکن است مشتری‌ها از یک فرم موکاپ بیشتر خوششان بیاید؛ اما در عمل برای بازدیدکنندگان مطلوب نباشد. در واقع فرایند طراحی وب چنان پیوند تنگاتنگی با محتوای وبسایت دارد که طراحی‌های برتر وب‌سایت‌ها زمانی که محتوایی در آن‌ها قرار نگرفته باشد، اصلاً خالی به نظر نمی‌رسند.
یکی از ایده‌های خوب برای شروع کار این است که نمونه‌ای از نوع محتوایی که انتظار دارید در سایت مشاهده شود را با در نرم‌افزار طراحی و یا مستقیماً از طریق کد رسم کنید و سپس به طراحی آن بپردازید. این فرایند به خصوص در مواردی که عکس‌ها یا تصاویری با سبک خاص در سایت استفاده می‌شوند بسیار مفید است، زیرا می‌توانید مطمئن باشید که طراحی شما با آن تصاویر هماهنگ خواهد بود. تصور کنید که محتوای یک سایت کاملاً منحصر به فرد است و شما قصد دارید قالبی طراحی کنید که بیشترین تناسب را با آن داشته باشد.
مطالعه ادامه مطلب 👇👇
🔗 کاربرد رنگ در طراحی وب — ۶ توصیه برای طراحی مطمئن وبسایت — کلیک کنید (+)
📌 کانال اختصاصی آموزشی طراحی و توسعه وب
آخرین مطالب علمی، مقالات رایگان و ویدئوهای آموزشی طراحی و توسعه وب را در کانال اختصاصی [@FaraWebDev] دنبال کنید. 👇
@FaraWebDev — مطالب و آموزش‌های طراحی و توسعه وب فرادرس
احتمالاً همه ما خاطراتی از نخستین روزهای آموزش خود به یاد داریم که در کلاس نقاشی، رنگ‌های مختلف در اختیار ما قرار می‌گرفت. برای نخستین بار شاهد بودیم که چگونه رنگ‌های اصلی در ترکیب با هم رنگ‌های ثانویه را می‌سازند و شاید با خودمان استدلال کرده‌ایم که اگر ترکیب دو رنگ باعث پدید آمدن چنین رنگ زیبایی شده است، پس ترکیب کردن همه رنگ‌ها با هم حتماً چیز بهتری خواهد ساخت! اما درک این نکته که مخلوط کردن همه رنگ‌ها با هم صرف‌نظر از شیوه اجرا، نتیجه‌ای نازیبا به بار می‌آورد، تجربه‌ای کاملاً مأیوس‌کننده بوده است.
══ فهرست مطالب ══
○ مقدمه‌ای بر تئوری رنگ
○ ۱. طرح رنگ نقاشی نیست؛ بلکه بوم است
○ ۲. با یک مبنای ساده خاکستری شروع کنید
○ ۳. برای هایلایت کردن تنها از یک رنگ استفاده کنید
○ ۴. اگر تردید دارید، از رنگ آبی استفاده کنید
○ ۵. از نسخه‌های مختلف رنگ هایلایت استفاده کنید
○ ۶. از گوشه راست-بالای نقشه رنگ اجتناب کنید
○ نکات مهم دیگر
○ سخن پایانی
🔸 مقدمه‌ای بر تئوری رنگ
در بلاگ فرادرس قبلاً در مورد طرح‌های رنگ بسیار صحبت کردیم و اطلاعاتی جذاب در مورد نظریه رنگ آموختیم. در مورد رنگ مایه، سایه‌روشن رنگ، تن رنگ، و اشباع و درخشش رنگ مطالبی خواندیم. همچنین طرح‌های رنگی متشابه، مونوکروم، سه‌گانه، مکمل و ترکیبی را معرفی کردیم.
اما بدون وجود یک چارچوب عملی برای استفاده از این اطلاعات، نمی‌توانید به ایجاد یک وبسایت با طراحی خوش رنگ نزدیک شوید. در واقع صرفاً با استفاده از تمرین ایجاد طرح‌های رنگی با آزمون و خطا است که می‌توانید به همه آن چه در مورد تئوری رنگ آموخته‌اید، معنایی عملی ببخشید.
در این فرایند برخی توصیه‌های کاربردی برای طرح‌های رنگ وب‌سایت‌ها وجود دارند که شاید افراد مبتدی از آن‌ها مطلع نباشند. زمانی که هنوز در ابتدای کار هستید، نظریه رنگ تنها چیزی نیست که با آن مواجه می‌شوید. در واقع در این زمان شما به چیزی نیاز دارید که جنبه تئوریک کمتری داشته باشد و راهنمای سرراست‌تری باشد.
🔸 ۱. طرح رنگ نقاشی نیست؛ بلکه بوم است
یکی از بنیادی‌ترین مفاهیم در طراحی وب آن است که مهم نیست چقدر زمان صرف طراحی یک طرح رنگ درخشان کرده باشید، در نهایت وظیفه آن این است که نقش دوم این نمایش باشد؛ چون نقش اول نمایش، محتوای وبسایت است. طرح رنگ شما نباید طوری باشد که درخشان‌تر از محتوای وبسایت به چشم بیاید. طراحی خوب آن طراحی است که در پس‌زمینه بماند و به ارائه بهتر محتوا در پیش‌زمینه کمک کند.
یکی از متداول‌ترین فرایندها در طراحی وب این است که خود طراحی در روندی تقریباً جداگانه و غالباً در نرم‌افزارهایی مانند فتوشاپ یا Sketch خلق می‌شود. اگر به محتوای نمونه وبسایت دسترسی نداشته باشید، احتمال این که طراحی ایجاد شده، خود به تنهایی عالی به نظر بیاید بیشتر می‌شود. ممکن است مشتری‌ها از یک فرم موکاپ بیشتر خوششان بیاید؛ اما در عمل برای بازدیدکنندگان مطلوب نباشد. در واقع فرایند طراحی وب چنان پیوند تنگاتنگی با محتوای وبسایت دارد که طراحی‌های برتر وب‌سایت‌ها زمانی که محتوایی در آن‌ها قرار نگرفته باشد، اصلاً خالی به نظر نمی‌رسند.
یکی از ایده‌های خوب برای شروع کار این است که نمونه‌ای از نوع محتوایی که انتظار دارید در سایت مشاهده شود را با در نرم‌افزار طراحی و یا مستقیماً از طریق کد رسم کنید و سپس به طراحی آن بپردازید. این فرایند به خصوص در مواردی که عکس‌ها یا تصاویری با سبک خاص در سایت استفاده می‌شوند بسیار مفید است، زیرا می‌توانید مطمئن باشید که طراحی شما با آن تصاویر هماهنگ خواهد بود. تصور کنید که محتوای یک سایت کاملاً منحصر به فرد است و شما قصد دارید قالبی طراحی کنید که بیشترین تناسب را با آن داشته باشد.
مطالعه ادامه مطلب 👇👇
🔗 کاربرد رنگ در طراحی وب — ۶ توصیه برای طراحی مطمئن وبسایت — کلیک کنید (+)
📌 کانال اختصاصی آموزشی طراحی و توسعه وب
آخرین مطالب علمی، مقالات رایگان و ویدئوهای آموزشی طراحی و توسعه وب را در کانال اختصاصی [@FaraWebDev] دنبال کنید. 👇
@FaraWebDev — مطالب و آموزش‌های طراحی و توسعه وب فرادرس
✳️ Node.js چیست و چه نقشی در توسعه وب دارد؟ — به زبان ساده
جاوا اسکریپت صرفاً یک زبان سمت کلاینت است که در مرورگر اجرا می‌شود. البته این وضعیت تا قبل از معرفی Node.js بود؛ چون با معرفی این مفهوم جدید اینک جاوا اسکریپت می‌تواند روی سرور نیز اجرا شود؛ اما Node.js چیزی بسیار بزرگ‌تر از جاوا اسکریپت صرف است. اگر به بحث توسعه وب علاقه‌مند هستید، می‌بایست به Node و موجی که در جامعه برنامه نویسان ایجاد کرده است، توجه داشته باشید.
══ فهرست مطالب ══
○ Node.js چیست؟
○ ماژول‌ها
○ چرا باید از Node.js استفاده کنیم؟
○ معایب
🔸 Node.js چیست؟
Node.js رابطی برای «محیط زمان اجرای» جاوا اسکریپت، V۸ محسوب می‌شود. V۸ مفسر بسیار سریع جاوا اسکریپت است که در مرورگر کروم اجرا می‌شود. همان طور که می‌دانید، شما می‌توانید V۸ را دانلود کنید و در هر کجا که دوست دارید، مورد استفاده قرار دهید. Node.js همین کار را در مورد وب‌سرورها انجام داده است. در نهایت باید گفت که جاوا اسکریپت یک زبان برنامه‌نویسی است و هیچ نشانه‌ای در دست نیست که بتوان از آن به عنوان یک سرور و همچنین در مرورگر کاربران استفاده کرد.
در یک استک سرور متداول به صورت LAMP یک وب‌سرور آپاچی یا NginX وجود دارد که PHP را اجرا می‌کند. هر اتصال جدید به سرور باعث می‌شود یک ترد جدید باز شود و این احتمال وجود دارد که خیلی زود عملکرد سرور کند شده یا به کلی از کار بیفتد. تنها راه خدمت‌رسانی به کاربران بیشتر اضافه کردن سرورهای بیشتر است. در واقع مقیاس‌پذیری در این سناریو تعریف چندانی ندارد. اما Node.js چنین وضعیتی ندارد. دیگر هیچ وب‌سرور آپاچی وجود ندارد که به اتصال‌های ورودی گوش دهد و کدهای وضعیت HTTP را بازگرداند. شما باید معماری هسته سرور را خودتان مدیریت کنید. خوشبختانه ماژول‌هایی برای آسان‌تر ساختن این کار عرضه شده‌اند؛ اما این فرایند همچنان در آغاز ممکن است پیچیده به نظر برسد. با این حال نتیجه کار اپلیکیشن‌های وب با عملکرد بالا است.
جاوا اسکریپت یک زبان رویداد-محور است. از این رو هر چیزی که روی سرور رخ می‌دهد، یک رویداد غیر مسدودکننده را آغاز می‌کند. هر اتصال جدید یک رویداد محسوب می‌شود، همچنین دریافت داده‌ها از یک فرم آپلود باعث ایجاد رویداد دریافت داده (data-received) می‌شود؛ درخواست داده‌ها از فایل‌های پایگاه داده نیز یک رویداد است. در عمل این وضعیت بدان معنی است که یک سایت Node.js هرگز قفل نمی‌شود و می‌تواند از ده‌ها هزار کاربر همزمان پشتیبانی کند. در واقع Node.js نقش سروری مانند آپاچی را ایفا می‌کند و کد برنامه‌ای را که روی آن اجرا می‌شود تفسیر می‌کند.
🔸 ماژول‌ها
همانند آپاچی ماژول‌ها یا کتابخانه‌های مختلفی وجود دارد که می‌توانند روی Node.js نصب شوند تا ویژگی‌ها و کارکردهای بیشتری برای آن ایجاد کنند. از جمله این کتابخانه‌ها می‌توان به انبار داده (data store)، پشتیبانی از فایل ZIP، ورود با فیسبوک یا درگاه‌های پرداخت اشاره کرد.
البته این ماژول‌ها به اندازه تعداد موجود برای پی‌اچ‌پی نیستند؛ اما Node.js هنوز در مراحل اولیه توسعه است و جامعه‌ای قدرتمند در پشت آن قرار دارد. یکی از مفاهیم اساسی Node.js توابع ناهمگام هستند. با استفاده از این توابع همه چیز در پس‌زمینه اجرا می‌شود. در اغلب زبان‌های اسکریپت‌نویسی سمت سرور، برنامه باید صبر کند هر تابع به پایان برسد تا بتواند به تابع بعدی برود. اما در Node.js می‌توان توابعی تعریف کرد که وقتی بخش‌های دیگر به کار خود ادامه می‌دهند، به اجرا بپردازد. این موضوعی پیچیده است که در این نوشته قصد نداریم بر روی آن متمرکز شویم؛ اما این‌ها خصوصیاتی هستند که Node.js را تعریف می‌کنند و از این رو آشنایی با آن‌ها حائز اهمیت است.
توضیح ویژگی‌های Node.js تا این جا کافی است. در ادامه یک مثال ساده از سرور HTTP ارائه می‌کنیم که برخی از این مفاهیم را به طور اجمالی برای شما توضیح دهد.
مطالعه ادامه مطلب 👇👇
🔗 Node.js چیست و چه نقشی در توسعه وب دارد؟ — به زبان ساده — کلیک کنید (+)
📌 کانال اختصاصی آموزشی طراحی و توسعه وب
آخرین مطالب علمی، مقالات رایگان و ویدئوهای آموزشی طراحی و توسعه وب را در کانال اختصاصی [@FaraWebDev] دنبال کنید. 👇
@FaraWebDev — مطالب و آموزش‌های طراحی و توسعه وب فرادرس
جاوا اسکریپت صرفاً یک زبان سمت کلاینت است که در مرورگر اجرا می‌شود. البته این وضعیت تا قبل از معرفی Node.js بود؛ چون با معرفی این مفهوم جدید اینک جاوا اسکریپت می‌تواند روی سرور نیز اجرا شود؛ اما Node.js چیزی بسیار بزرگ‌تر از جاوا اسکریپت صرف است. اگر به بحث توسعه وب علاقه‌مند هستید، می‌بایست به Node و موجی که در جامعه برنامه نویسان ایجاد کرده است، توجه داشته باشید.
══ فهرست مطالب ══
○ Node.js چیست؟
○ ماژول‌ها
○ چرا باید از Node.js استفاده کنیم؟
○ معایب
🔸 Node.js چیست؟
Node.js رابطی برای «محیط زمان اجرای» جاوا اسکریپت، V۸ محسوب می‌شود. V۸ مفسر بسیار سریع جاوا اسکریپت است که در مرورگر کروم اجرا می‌شود. همان طور که می‌دانید، شما می‌توانید V۸ را دانلود کنید و در هر کجا که دوست دارید، مورد استفاده قرار دهید. Node.js همین کار را در مورد وب‌سرورها انجام داده است. در نهایت باید گفت که جاوا اسکریپت یک زبان برنامه‌نویسی است و هیچ نشانه‌ای در دست نیست که بتوان از آن به عنوان یک سرور و همچنین در مرورگر کاربران استفاده کرد.
در یک استک سرور متداول به صورت LAMP یک وب‌سرور آپاچی یا NginX وجود دارد که PHP را اجرا می‌کند. هر اتصال جدید به سرور باعث می‌شود یک ترد جدید باز شود و این احتمال وجود دارد که خیلی زود عملکرد سرور کند شده یا به کلی از کار بیفتد. تنها راه خدمت‌رسانی به کاربران بیشتر اضافه کردن سرورهای بیشتر است. در واقع مقیاس‌پذیری در این سناریو تعریف چندانی ندارد. اما Node.js چنین وضعیتی ندارد. دیگر هیچ وب‌سرور آپاچی وجود ندارد که به اتصال‌های ورودی گوش دهد و کدهای وضعیت HTTP را بازگرداند. شما باید معماری هسته سرور را خودتان مدیریت کنید. خوشبختانه ماژول‌هایی برای آسان‌تر ساختن این کار عرضه شده‌اند؛ اما این فرایند همچنان در آغاز ممکن است پیچیده به نظر برسد. با این حال نتیجه کار اپلیکیشن‌های وب با عملکرد بالا است.
جاوا اسکریپت یک زبان رویداد-محور است. از این رو هر چیزی که روی سرور رخ می‌دهد، یک رویداد غیر مسدودکننده را آغاز می‌کند. هر اتصال جدید یک رویداد محسوب می‌شود، همچنین دریافت داده‌ها از یک فرم آپلود باعث ایجاد رویداد دریافت داده (data-received) می‌شود؛ درخواست داده‌ها از فایل‌های پایگاه داده نیز یک رویداد است. در عمل این وضعیت بدان معنی است که یک سایت Node.js هرگز قفل نمی‌شود و می‌تواند از ده‌ها هزار کاربر همزمان پشتیبانی کند. در واقع Node.js نقش سروری مانند آپاچی را ایفا می‌کند و کد برنامه‌ای را که روی آن اجرا می‌شود تفسیر می‌کند.
🔸 ماژول‌ها
همانند آپاچی ماژول‌ها یا کتابخانه‌های مختلفی وجود دارد که می‌توانند روی Node.js نصب شوند تا ویژگی‌ها و کارکردهای بیشتری برای آن ایجاد کنند. از جمله این کتابخانه‌ها می‌توان به انبار داده (data store)، پشتیبانی از فایل ZIP، ورود با فیسبوک یا درگاه‌های پرداخت اشاره کرد.
البته این ماژول‌ها به اندازه تعداد موجود برای پی‌اچ‌پی نیستند؛ اما Node.js هنوز در مراحل اولیه توسعه است و جامعه‌ای قدرتمند در پشت آن قرار دارد. یکی از مفاهیم اساسی Node.js توابع ناهمگام هستند. با استفاده از این توابع همه چیز در پس‌زمینه اجرا می‌شود. در اغلب زبان‌های اسکریپت‌نویسی سمت سرور، برنامه باید صبر کند هر تابع به پایان برسد تا بتواند به تابع بعدی برود. اما در Node.js می‌توان توابعی تعریف کرد که وقتی بخش‌های دیگر به کار خود ادامه می‌دهند، به اجرا بپردازد. این موضوعی پیچیده است که در این نوشته قصد نداریم بر روی آن متمرکز شویم؛ اما این‌ها خصوصیاتی هستند که Node.js را تعریف می‌کنند و از این رو آشنایی با آن‌ها حائز اهمیت است.
توضیح ویژگی‌های Node.js تا این جا کافی است. در ادامه یک مثال ساده از سرور HTTP ارائه می‌کنیم که برخی از این مفاهیم را به طور اجمالی برای شما توضیح دهد.
مطالعه ادامه مطلب 👇👇
🔗 Node.js چیست و چه نقشی در توسعه وب دارد؟ — به زبان ساده — کلیک کنید (+)
📌 کانال اختصاصی آموزشی طراحی و توسعه وب
آخرین مطالب علمی، مقالات رایگان و ویدئوهای آموزشی طراحی و توسعه وب را در کانال اختصاصی [@FaraWebDev] دنبال کنید. 👇
@FaraWebDev — مطالب و آموزش‌های طراحی و توسعه وب فرادرس
✳️ وردپرس یا دروپال، کدامیک بهتر است؟ — مقایسه جامع
وردپرس از نخستین انتخاب‌های کاربران برای راه‌اندازی یک وبسایت به حساب می‌آید. دلیل این مسئله آن است که وردپرس امروزه سهم عمده بازار را در اختیار دارد.
══ فهرست مطالب ══
○ دروپال یا وردپرس: کدام یک را باید استفاده کرد؟
○ دروپال یا وردپرس: سهولت استفاده
○ دروپال یا وردپرس: جامعه و منابع
○ دروپال یا وردپرس: امنیت
○ دروپال یا وردپرس – هزینه و قیمت
○ دروپال یا وردپرس: انعطاف‌پذیری
○ دروپال یا وردپرس: محبوبیت
○ از کدام CMS متن-باز باید استفاده کرد؟
🔸 دروپال یا وردپرس: کدام یک را باید استفاده کرد؟
وردپرس و دروپال مشابهت‌های زیادی دارند. هر دو آن‌ها سیستم‌های مدیریت محتوای متن-بازی هستند که مجموعه ویژگی‌های منسجمی دارند. با این حال، کاربرانی که از هر کدام از آن‌ها استفاده می‌کنند، تفاوت‌های عمده‌ای دارند. همه افراد از کسانی که به دنبال یک بلاگ ساده هستند تا وبمسترهایی که سایت‌های با ترافیک بالا دارند، می‌توانند از وب‌سایت‌های با سفارشی‌سازی بالایی که وردپرس ارائه می‌دهد بهره‌مند شوند.
از سوی دیگر دروپال برای کاربرانی مناسب‌تر است که تا حدودی با تجربه توسعه وب آشنایی دارند. به علاوه دروپال ماهیتی با عملکرد بالا و مقیاس‌پذیری گسترده دارد. این بدان معنی است که دروپال برای وب‌سایت‌های سازمانی که تا حدودی از کاربران متوسط فاصله می‌گیرند، مناسب‌تر است.
– وردپرس – هر کاربری از مبتدی تا تجاری
– دروپال – وب‌سایت‌های در محیط تجاری و سازمانی
🔸 دروپال یا وردپرس: سهولت استفاده
اغلب بلاگرها به عنوان نخستین تجربه خود از سیستم وردپرس استفاده کرده‌اند. اکثر آن‌ها یک حساب رایگان در وبسایت wordpress.com ایجاد کرده‌اند که در ادامه به یک وبسایت خود-میزبان تبدیل می‌شود. بیشتر شرکت‌های ارائه دهنده خدمات میزبانی وبسایت، امکان ایجاد سایت‌های وردپرسی را با صرفاً یک کلیک ارائه می‌کنند. بدین ترتیب می‌توان در طی چند دقیقه یک وبسایت با CMS وردپرس تحویل گرفت. البته حتی در صورتی که بخواهید وردپرس را روی سرور خود نصب کنید هم پیچیدگی چندانی ندارد.
با این حال دروپال قطعاً پیچیده‌تر است. با این که کاربرد هر روزه آن قابلیت مدیریت بیشتری دارد؛ اما نصب دروپال به اندازه نصب وردپرس آسان نیست. کسانی که هر دو CMS را نصب کرده‌اند می‌دانند که نصب وردپرس تقریباً به هیچ دانشی نیاز ندارد، اما دروپال چنین نیست و نیازمند نوعی مراحل عیب‌یابی است.
حتی در استفاده‌های معمولی روزمره نیز وردپرس ساده‌تر از دروپال است. ویرایشگر WYSIWYG آن کارکردهای زیادی را ارائه می‌دهد. به طور کلی وردپرس برای افراد غیر برنامه‌نویس، بسیار محبوب‌تر است. دروپال دشواری چندانی ندارد؛ اما در هر حال منحنی یادگیری آن شیب بیشتری دارد.
مطالعه ادامه مطلب 👇👇
🔗 وردپرس یا دروپال، کدامیک بهتر است؟ — مقایسه جامع — کلیک کنید (+)
📌 کانال اختصاصی آموزشی طراحی و توسعه وب
آخرین مطالب علمی، مقالات رایگان و ویدئوهای آموزشی طراحی و توسعه وب را در کانال اختصاصی [@FaraWebDev] دنبال کنید. 👇
@FaraWebDev — مطالب و آموزش‌های طراحی و توسعه وب فرادرس
وردپرس از نخستین انتخاب‌های کاربران برای راه‌اندازی یک وبسایت به حساب می‌آید. دلیل این مسئله آن است که وردپرس امروزه سهم عمده بازار را در اختیار دارد.
══ فهرست مطالب ══
○ دروپال یا وردپرس: کدام یک را باید استفاده کرد؟
○ دروپال یا وردپرس: سهولت استفاده
○ دروپال یا وردپرس: جامعه و منابع
○ دروپال یا وردپرس: امنیت
○ دروپال یا وردپرس – هزینه و قیمت
○ دروپال یا وردپرس: انعطاف‌پذیری
○ دروپال یا وردپرس: محبوبیت
○ از کدام CMS متن-باز باید استفاده کرد؟
🔸 دروپال یا وردپرس: کدام یک را باید استفاده کرد؟
وردپرس و دروپال مشابهت‌های زیادی دارند. هر دو آن‌ها سیستم‌های مدیریت محتوای متن-بازی هستند که مجموعه ویژگی‌های منسجمی دارند. با این حال، کاربرانی که از هر کدام از آن‌ها استفاده می‌کنند، تفاوت‌های عمده‌ای دارند. همه افراد از کسانی که به دنبال یک بلاگ ساده هستند تا وبمسترهایی که سایت‌های با ترافیک بالا دارند، می‌توانند از وب‌سایت‌های با سفارشی‌سازی بالایی که وردپرس ارائه می‌دهد بهره‌مند شوند.
از سوی دیگر دروپال برای کاربرانی مناسب‌تر است که تا حدودی با تجربه توسعه وب آشنایی دارند. به علاوه دروپال ماهیتی با عملکرد بالا و مقیاس‌پذیری گسترده دارد. این بدان معنی است که دروپال برای وب‌سایت‌های سازمانی که تا حدودی از کاربران متوسط فاصله می‌گیرند، مناسب‌تر است.
– وردپرس – هر کاربری از مبتدی تا تجاری
– دروپال – وب‌سایت‌های در محیط تجاری و سازمانی
🔸 دروپال یا وردپرس: سهولت استفاده
اغلب بلاگرها به عنوان نخستین تجربه خود از سیستم وردپرس استفاده کرده‌اند. اکثر آن‌ها یک حساب رایگان در وبسایت wordpress.com ایجاد کرده‌اند که در ادامه به یک وبسایت خود-میزبان تبدیل می‌شود. بیشتر شرکت‌های ارائه دهنده خدمات میزبانی وبسایت، امکان ایجاد سایت‌های وردپرسی را با صرفاً یک کلیک ارائه می‌کنند. بدین ترتیب می‌توان در طی چند دقیقه یک وبسایت با CMS وردپرس تحویل گرفت. البته حتی در صورتی که بخواهید وردپرس را روی سرور خود نصب کنید هم پیچیدگی چندانی ندارد.
با این حال دروپال قطعاً پیچیده‌تر است. با این که کاربرد هر روزه آن قابلیت مدیریت بیشتری دارد؛ اما نصب دروپال به اندازه نصب وردپرس آسان نیست. کسانی که هر دو CMS را نصب کرده‌اند می‌دانند که نصب وردپرس تقریباً به هیچ دانشی نیاز ندارد، اما دروپال چنین نیست و نیازمند نوعی مراحل عیب‌یابی است.
حتی در استفاده‌های معمولی روزمره نیز وردپرس ساده‌تر از دروپال است. ویرایشگر WYSIWYG آن کارکردهای زیادی را ارائه می‌دهد. به طور کلی وردپرس برای افراد غیر برنامه‌نویس، بسیار محبوب‌تر است. دروپال دشواری چندانی ندارد؛ اما در هر حال منحنی یادگیری آن شیب بیشتری دارد.
مطالعه ادامه مطلب 👇👇
🔗 وردپرس یا دروپال، کدامیک بهتر است؟ — مقایسه جامع — کلیک کنید (+)
📌 کانال اختصاصی آموزشی طراحی و توسعه وب
آخرین مطالب علمی، مقالات رایگان و ویدئوهای آموزشی طراحی و توسعه وب را در کانال اختصاصی [@FaraWebDev] دنبال کنید. 👇
@FaraWebDev — مطالب و آموزش‌های طراحی و توسعه وب فرادرس
✳️ زبان برنامه نویسی کاتلین (Kotlin) — راهنمای کاربردی
در این مطلب، به بررسی زبان برنامه‌نویسی کاتلین (Kotlin Programming Language) پرداخته شده است. جامعه توسعه‌دهندگان نرم‌افزارهای کاربردی موبایل که از زبان کاتلین استفاده می‌کنند، به سرعت در حال افزایش است. در سال ۲۰۱۷، گوگل، کاتلین را به عنوان دومین زبان رسمی خود برای توسعه اندروید معرفی کرد. از آن زمان تاکنون، رشد بسیار بزرگ و مهمی در تقاضا برای این زبان برنامه‌نویسی در میان توسعه‌دهندگان و جوامع کسب و کار به وقوع پیوسته است. گوگل در حال حاضر زبان برنامه نویسی کاتلین را به عنوان یکی از بهترین زبان‌های برنامه‌نویسی برای توسعه اپلیکیشن‌های اندرویدی اعلام کرده است. این نشان می‌دهد که آینده خوبی در انتظار این زبان برنامه‌نویسی است.
══ فهرست مطالب ══
○ زبان برنامه نویسی کاتلین
○ ویژگی‌های کلیدی کاتلین
○ مزایای زبان کاتلین
○ کاربردهای زبان کاتلین
🔸 زبان برنامه نویسی کاتلین
«کاتلین» (Kotlin) یک زبان برنامه‌نویسی «تایپ استاتیک» (Statically Typed) و «همه‌منظوره» (General-Purpose) است که توسط «جت‌برینز» (JetBrains) توسعه داده شده و دارای «محیط‌های توسعه یکپارچه» (Integrated Development Environment) کلاس جهانی مانند «اینتلیج آیدیا» (IntelliJ IDEA)، «پی‌اچ‌پی‌استورم» (PhpStorm)، «اپ‌کد» (Appcode) و دیگر موارد است.
«کاتلین» (Kotlin) ابتدا و در سال ۲۰۱۱ میلادی توسط جت‌برینز به عنوان زبان جدیدی برای JVM معرفی شد. این زبان، یک زبان برنامه‌نویسی «شی‌گرا» (Object Oriented) است و به زعم بسیاری از افراد، بهتر از «جاوا» (Java) محسوب می‌شود.
گوگل اسپانسر کاتلین است. این زبان در سال ۲۰۱۷، توسط گوگل، به عنوان دومین زبان رسمی برای توسعه اندروید معرفی شد. مثالی از کد نوشته شده به این زبان، در ادامه ارائه شده است.
🔸 ویژگی‌های کلیدی کاتلین
در ادامه، برخی از ویژگی‌های کلیدی زبان برنامه نویسی کاتلین مورد بررسی قرار می‌گیرد.
تایپ استاتیک: تایپ استاتیک یک مشخصه برنامه‌نویسی کامپیوتری است؛ بدین معنا که نوع هر متغیر و عبارت در زمان کامپایل شناخته می‌شود. با وجود اینکه کاتلین یک زبان تایپ استاتیک است، نیاز به این ندارد که نوع هر متغیر صراحتا «اعلان» (Declare) شود.
کلاس‌های داده: در این زبان، «کلاس‌های داده‌ای» (Data Classes) وجود دارد که منجر به تولید خودکار تساوی‌های قابل استفاده مجدد (Boilerplate Like Equals)، «هش کد» (HashCode) و toString و بسیاری از گزینه‌های دیگر می‌شود.
مطالعه ادامه مطلب 👇👇
🔗 زبان برنامه نویسی کاتلین (Kotlin) — راهنمای کاربردی — کلیک کنید (+)
📌 کانال اختصاصی آموزشی طراحی و توسعه وب
آخرین مطالب علمی، مقالات رایگان و ویدئوهای آموزشی طراحی و توسعه وب را در کانال اختصاصی [@FaraWebDev] دنبال کنید. 👇
@FaraWebDev — مطالب و آموزش‌های طراحی و توسعه وب فرادرس
در این مطلب، به بررسی زبان برنامه‌نویسی کاتلین (Kotlin Programming Language) پرداخته شده است. جامعه توسعه‌دهندگان نرم‌افزارهای کاربردی موبایل که از زبان کاتلین استفاده می‌کنند، به سرعت در حال افزایش است. در سال ۲۰۱۷، گوگل، کاتلین را به عنوان دومین زبان رسمی خود برای توسعه اندروید معرفی کرد. از آن زمان تاکنون، رشد بسیار بزرگ و مهمی در تقاضا برای این زبان برنامه‌نویسی در میان توسعه‌دهندگان و جوامع کسب و کار به وقوع پیوسته است. گوگل در حال حاضر زبان برنامه نویسی کاتلین را به عنوان یکی از بهترین زبان‌های برنامه‌نویسی برای توسعه اپلیکیشن‌های اندرویدی اعلام کرده است. این نشان می‌دهد که آینده خوبی در انتظار این زبان برنامه‌نویسی است.
══ فهرست مطالب ══
○ زبان برنامه نویسی کاتلین
○ ویژگی‌های کلیدی کاتلین
○ مزایای زبان کاتلین
○ کاربردهای زبان کاتلین
🔸 زبان برنامه نویسی کاتلین
«کاتلین» (Kotlin) یک زبان برنامه‌نویسی «تایپ استاتیک» (Statically Typed) و «همه‌منظوره» (General-Purpose) است که توسط «جت‌برینز» (JetBrains) توسعه داده شده و دارای «محیط‌های توسعه یکپارچه» (Integrated Development Environment) کلاس جهانی مانند «اینتلیج آیدیا» (IntelliJ IDEA)، «پی‌اچ‌پی‌استورم» (PhpStorm)، «اپ‌کد» (Appcode) و دیگر موارد است.
«کاتلین» (Kotlin) ابتدا و در سال ۲۰۱۱ میلادی توسط جت‌برینز به عنوان زبان جدیدی برای JVM معرفی شد. این زبان، یک زبان برنامه‌نویسی «شی‌گرا» (Object Oriented) است و به زعم بسیاری از افراد، بهتر از «جاوا» (Java) محسوب می‌شود.
گوگل اسپانسر کاتلین است. این زبان در سال ۲۰۱۷، توسط گوگل، به عنوان دومین زبان رسمی برای توسعه اندروید معرفی شد. مثالی از کد نوشته شده به این زبان، در ادامه ارائه شده است.
🔸 ویژگی‌های کلیدی کاتلین
در ادامه، برخی از ویژگی‌های کلیدی زبان برنامه نویسی کاتلین مورد بررسی قرار می‌گیرد.
تایپ استاتیک: تایپ استاتیک یک مشخصه برنامه‌نویسی کامپیوتری است؛ بدین معنا که نوع هر متغیر و عبارت در زمان کامپایل شناخته می‌شود. با وجود اینکه کاتلین یک زبان تایپ استاتیک است، نیاز به این ندارد که نوع هر متغیر صراحتا «اعلان» (Declare) شود.
کلاس‌های داده: در این زبان، «کلاس‌های داده‌ای» (Data Classes) وجود دارد که منجر به تولید خودکار تساوی‌های قابل استفاده مجدد (Boilerplate Like Equals)، «هش کد» (HashCode) و toString و بسیاری از گزینه‌های دیگر می‌شود.
مطالعه ادامه مطلب 👇👇
🔗 زبان برنامه نویسی کاتلین (Kotlin) — راهنمای کاربردی — کلیک کنید (+)
📌 کانال اختصاصی آموزشی طراحی و توسعه وب
آخرین مطالب علمی، مقالات رایگان و ویدئوهای آموزشی طراحی و توسعه وب را در کانال اختصاصی [@FaraWebDev] دنبال کنید. 👇
@FaraWebDev — مطالب و آموزش‌های طراحی و توسعه وب فرادرس
✳️ طراحی یک وب سایت ساده با PHP — از صفر تا صد
دوست دارید نحوه ساختن یک وبسایت را بیاموزید؟ زمانی برای اینکار تنها شروع به یادگیری HTML کافی بود، اما این روزها بهترین راه‌حل برای این مسئله PHP و البته یادگیری آن است. هر چند هنوز هم لازم است برای شروع به کار قدری دانش کدنویسی HTML داشته باشید، اما می‌توانیم بدون اغراق بگوئیم که PHP اکنون محبوب‌ترین گزینه برای ساخت انواع سایت‌های استاتیک و دینامیک است. بسیار خب، حالا می‌دانیم که باید PHP یاد بگیریم و یکی از بهترین راه‌ها برای یادگیری آن، ساخت یک وب سایت ساده با PHP است؛ کاری که بنا داریم در ادامه انجام دهیم.
══ فهرست مطالب ══
○ چرا باید از PHP برای توسعه وبسایت استفاده کنیم؟
○ برای ساخت یک وبسایت PHP به چه چیزی نیاز داریم؟
○ آغاز کار با PHP: آشنایی با دستور زبان
○ ساخت یک وبسایت: آشنایی با ساختار
○ آغاز طراحی وبسایت: هدر PHP
○ درج محتوا در بدنه صفحه وب PHP
○ استفاده از فوتر PHP در صفحه وب
○ جمع‌بندی
○ سخن پایانی
🔸 چرا باید از PHP برای توسعه وبسایت استفاده کنیم؟
گزینه‌های مختلفی برای توسعه وب در این سال‌ها مطرح شده‌اند. در آغاز HTML ساده استفاده می‌شد، سپس توسعه‌دهندگان از HTML به همراه CSS جاسازی شده یا یک ارجاع به فایل CSS استفاده کردند. زمانی که وب‌سایت‌های دینامیک مطرح شدند، ASP (که در ادامه به ASP.NET تبدیل شد) و PHP نیز وارد میدان شدند.
بر اساس آمار و ارقام اکنون PHP با سهم ۸۲ درصدی از وب‌سایت‌ها به عنوان محبوب‌ترین زبان برنامه‌نویسی سمت سرور مطرح است. این عدد را با ۱۶ درصد که از ASP استفاده می‌کنند مقایسه کنید.
ASP تا سال ۲۰۲۲ پشتیبانی خواهد شد، اما انتظار نمی‌رود پس از این تاریخ به صورت رسمی دست کم به عنوان یک فناوری وب تداوم داشته باشد. PHP که اختصاری برای عبارت «پیش پردازشگر ابرمتن PHP» (به معنی PHP Hypertext Preprocessor) است موفقیت زیادی داشته است که به طور عمده ناشی از یکپارچگی آن با لینوکس است.
🔸 برای ساخت یک وبسایت PHP به چه چیزی نیاز داریم؟
پیش از آن که کار ساخت وبسایت خود را آغاز کنیم، باید مطمئن شویم که یک ادیتور متن ساده یا محیط توسعه مناسب PHP را نصب کرده‌ایم. برای کدنویسی PHP می‌توانید در ابتدا از چیزی به سادگی Notepad ویندوز استفاده کنید. مثال‌هایی که در این مقاله مطرح می‌شوند، همگی با استفاده از ادیتور متن Notepad++ نوشته شده‌اند.
همچنین باید یک وب‌سرور PHP داشته باشید که فایل‌های خود را روی آن آپلود کنید. این سرور می‌تواند یک سرور ریموت یا یک رایانه محلی باشد که مجموعه LAMP روی آن نصب شده است. LAMP اختصاری برای عبارت‌های Linux ،Apache ،MySQL ،PHP است. به طور جایگزین می‌توانید از مجموعه WAMP که اختصاری برای عبارت‌های Windows ،Apache، MySQL ،PHP است استفاده کنید. اگر از ویندوز استفاده می‌کنید، می‌توانید از این راهنما بهره بگیرید:
– چگونه یک سرور WAMP راه‌اندازی کنیم؟ — از صفر تا صد
در نهایت به یک برنامه FTP نیاز دارید تا فایل‌هایتان را روی وب‌سرور آپلود کنید. به این منظور برنامه‌های مختلفی مانند WinSCP، Cyberduck و FileZilla وجود دارند.
مطالعه ادامه مطلب 👇👇
🔗 طراحی یک وب سایت ساده با PHP — از صفر تا صد — کلیک کنید (+)
📌 کانال اختصاصی آموزشی طراحی و توسعه وب
آخرین مطالب علمی، مقالات رایگان و ویدئوهای آموزشی طراحی و توسعه وب را در کانال اختصاصی [@FaraWebDev] دنبال کنید. 👇
@FaraWebDev — مطالب و آموزش‌های طراحی و توسعه وب فرادرس
دوست دارید نحوه ساختن یک وبسایت را بیاموزید؟ زمانی برای اینکار تنها شروع به یادگیری HTML کافی بود، اما این روزها بهترین راه‌حل برای این مسئله PHP و البته یادگیری آن است. هر چند هنوز هم لازم است برای شروع به کار قدری دانش کدنویسی HTML داشته باشید، اما می‌توانیم بدون اغراق بگوئیم که PHP اکنون محبوب‌ترین گزینه برای ساخت انواع سایت‌های استاتیک و دینامیک است. بسیار خب، حالا می‌دانیم که باید PHP یاد بگیریم و یکی از بهترین راه‌ها برای یادگیری آن، ساخت یک وب سایت ساده با PHP است؛ کاری که بنا داریم در ادامه انجام دهیم.
══ فهرست مطالب ══
○ چرا باید از PHP برای توسعه وبسایت استفاده کنیم؟
○ برای ساخت یک وبسایت PHP به چه چیزی نیاز داریم؟
○ آغاز کار با PHP: آشنایی با دستور زبان
○ ساخت یک وبسایت: آشنایی با ساختار
○ آغاز طراحی وبسایت: هدر PHP
○ درج محتوا در بدنه صفحه وب PHP
○ استفاده از فوتر PHP در صفحه وب
○ جمع‌بندی
○ سخن پایانی
🔸 چرا باید از PHP برای توسعه وبسایت استفاده کنیم؟
گزینه‌های مختلفی برای توسعه وب در این سال‌ها مطرح شده‌اند. در آغاز HTML ساده استفاده می‌شد، سپس توسعه‌دهندگان از HTML به همراه CSS جاسازی شده یا یک ارجاع به فایل CSS استفاده کردند. زمانی که وب‌سایت‌های دینامیک مطرح شدند، ASP (که در ادامه به ASP.NET تبدیل شد) و PHP نیز وارد میدان شدند.
بر اساس آمار و ارقام اکنون PHP با سهم ۸۲ درصدی از وب‌سایت‌ها به عنوان محبوب‌ترین زبان برنامه‌نویسی سمت سرور مطرح است. این عدد را با ۱۶ درصد که از ASP استفاده می‌کنند مقایسه کنید.
ASP تا سال ۲۰۲۲ پشتیبانی خواهد شد، اما انتظار نمی‌رود پس از این تاریخ به صورت رسمی دست کم به عنوان یک فناوری وب تداوم داشته باشد. PHP که اختصاری برای عبارت «پیش پردازشگر ابرمتن PHP» (به معنی PHP Hypertext Preprocessor) است موفقیت زیادی داشته است که به طور عمده ناشی از یکپارچگی آن با لینوکس است.
🔸 برای ساخت یک وبسایت PHP به چه چیزی نیاز داریم؟
پیش از آن که کار ساخت وبسایت خود را آغاز کنیم، باید مطمئن شویم که یک ادیتور متن ساده یا محیط توسعه مناسب PHP را نصب کرده‌ایم. برای کدنویسی PHP می‌توانید در ابتدا از چیزی به سادگی Notepad ویندوز استفاده کنید. مثال‌هایی که در این مقاله مطرح می‌شوند، همگی با استفاده از ادیتور متن Notepad++ نوشته شده‌اند.
همچنین باید یک وب‌سرور PHP داشته باشید که فایل‌های خود را روی آن آپلود کنید. این سرور می‌تواند یک سرور ریموت یا یک رایانه محلی باشد که مجموعه LAMP روی آن نصب شده است. LAMP اختصاری برای عبارت‌های Linux ،Apache ،MySQL ،PHP است. به طور جایگزین می‌توانید از مجموعه WAMP که اختصاری برای عبارت‌های Windows ،Apache، MySQL ،PHP است استفاده کنید. اگر از ویندوز استفاده می‌کنید، می‌توانید از این راهنما بهره بگیرید:
– چگونه یک سرور WAMP راه‌اندازی کنیم؟ — از صفر تا صد
در نهایت به یک برنامه FTP نیاز دارید تا فایل‌هایتان را روی وب‌سرور آپلود کنید. به این منظور برنامه‌های مختلفی مانند WinSCP، Cyberduck و FileZilla وجود دارند.
مطالعه ادامه مطلب 👇👇
🔗 طراحی یک وب سایت ساده با PHP — از صفر تا صد — کلیک کنید (+)
📌 کانال اختصاصی آموزشی طراحی و توسعه وب
آخرین مطالب علمی، مقالات رایگان و ویدئوهای آموزشی طراحی و توسعه وب را در کانال اختصاصی [@FaraWebDev] دنبال کنید. 👇
@FaraWebDev — مطالب و آموزش‌های طراحی و توسعه وب فرادرس
✳️ ۳۰ ابزار مفید برای صرفه‌جویی در زمان در هنگام طراحی وب
وقتی صحبت از طراحی وب می‌شود، سرعت و مدت زمان طراحی یک رکن بسیار مهم است. در این مقاله به معرفی چند ابزار مناسب برای سرعت بخشیدن به طراحی وبسایت می‌پردازیم.
══ فهرست مطالب ══
○ کتابخانه‌های CSS
🔸 کتابخانه‌های CSS
Topcoat: یک فریمورک است که در CSS استفاده می‌شود. لینک دسترسی (+)
Create ken burns effect: برای ساخت انیمیشن‌هایی به سبک «ken burns effect» در css۳ از این افزونه استفاده می‌شود. لینک دسترسی (+)
DynCSS: برای اضافه کردن توابع به css و پویا سازی آن استفاده می‌شود. لینک دسترسی (+)
مطالعه ادامه مطلب 👇👇
🔗 ۳۰ ابزار مفید برای صرفه‌جویی در زمان در هنگام طراحی وب — کلیک کنید (+)
📌 کانال اختصاصی آموزشی طراحی و توسعه وب
آخرین مطالب علمی، مقالات رایگان و ویدئوهای آموزشی طراحی و توسعه وب را در کانال اختصاصی [@FaraWebDev] دنبال کنید. 👇
@FaraWebDev — مطالب و آموزش‌های طراحی و توسعه وب فرادرس
وقتی صحبت از طراحی وب می‌شود، سرعت و مدت زمان طراحی یک رکن بسیار مهم است. در این مقاله به معرفی چند ابزار مناسب برای سرعت بخشیدن به طراحی وبسایت می‌پردازیم.
══ فهرست مطالب ══
○ کتابخانه‌های CSS
🔸 کتابخانه‌های CSS
Topcoat: یک فریمورک است که در CSS استفاده می‌شود. لینک دسترسی (+)
Create ken burns effect: برای ساخت انیمیشن‌هایی به سبک «ken burns effect» در css۳ از این افزونه استفاده می‌شود. لینک دسترسی (+)
DynCSS: برای اضافه کردن توابع به css و پویا سازی آن استفاده می‌شود. لینک دسترسی (+)
مطالعه ادامه مطلب 👇👇
🔗 ۳۰ ابزار مفید برای صرفه‌جویی در زمان در هنگام طراحی وب — کلیک کنید (+)
📌 کانال اختصاصی آموزشی طراحی و توسعه وب
آخرین مطالب علمی، مقالات رایگان و ویدئوهای آموزشی طراحی و توسعه وب را در کانال اختصاصی [@FaraWebDev] دنبال کنید. 👇
@FaraWebDev — مطالب و آموزش‌های طراحی و توسعه وب فرادرس
✳️ ۱۰ نکته مهم برای توسعه فرانت اند — راهنمای کاربردی
بدیهی است که توسعه فرانت اند در سال ۲۰۲۰ یکی از رشته‌های پرطرفدار برنامه‌نویسی محسوب می‌شود. تا همین اواخر کافی بود که توسعه‌دهندگان فرانت‌اند مقداری با HTML ،CSS و شاید jQuery آشنا باشند تا بتوانند یک وبسایت تعاملی ایجاد کنند. اما امروزه توسعه‌دهندگان فرانت‌اند با اکوسیستم وسیع و مداوماً در حال تغییر از مهارت‌های توسعه، ابزارها، کتابخانه‌ها و فریمورک‌هایی که باید بیاموزند مواجه شده‌اند و باید زمان زیادی را صرف آموزش شخصی خودشان بکنند. تا انتهای این راهنما با ما همراه باشید.
══ فهرست مطالب ══
○ فریمورک‌های توسعه فرانت اند
○ تولیدکنندگان سایت استاتیک
○ JAMstack
○ PWA
○ GraphQL
○ ادیتورهای کد یا IDE-ها
○ تست کردن کدهای فرانت اند
○ کد تمیز
○ Git برای توسعه دهندگان فرانت اند
○ مهارت‌های نرم لازم برای توسعه دهندگان فرانت اند
○ سخن پایانی
🔸 فریمورک‌های توسعه فرانت اند
در سال ۲۰۲۰ احتمالاً شاهد یک دوئل بین ReactJS فیسبوک و VueJS قدرت‌گرفته از جامعه توسعه‌دهندگان خواهیم بود. ری‌اکت هم‌اینک دارای ۱۴۰هزار ستاره در گیت‌هاب است در حالی که تعداد ستاره‌های Vue در گیت‌هاب از آن بیشتر و برابر با ۱۵۳ هزار ستاره است. برای مقایسه باید اشاره کنیم که انگولار دارای ۵۳۰۰۰ ستاره است.
مقایسه حجم جستجوی کلمه React (خط آبی در تصویر زیر) در سال ۲۰۱۹، در برابر Vue (رنگ قرمز)، انگولار (رنگ زرد)، Svelte (رنگ سبز) از این فرضیه پشتیبانی می‌کند. چنان که می‌بینید Vue کمی بالاتر از ری‌اکت قرار دارد. انگولار این حجم از جستجو را ندارد و Svelte قطعاً هیچ نقشی در این مقایسه ندارد.
بنابراین در سال ۲۰۲۰ توسعه‌دهندگان فرانت‌اند که با فریمورک‌های جاوا اسکریپت کار می‌کنند یا قصد این کار را دارند، باید روی React یا Vue به عنوان گزینه‌های اصلی تمرکز کنند. انگولار نیز در صورتی که روی پروژه‌های سازمانی بزرگ کار می‌کنید گزینه معتبری محسوب می‌شود. اگر می‌خواهید در مورد این فریمورکها بیشتر بدانید می‌توانید به وبسایت ری‌اکت (+) و Vue.js (+) مراجعه کنید.
🔸 تولیدکنندگان سایت استاتیک
تولیدکنندگان سایت استاتیک قدرت رندرینگ سمت سرور (که برای سئو بسیار مهم است اما زمان بارگذاری اولیه را افزایش می‌دهند) را با اپلیکیشن‌های تک‌صفحه‌ای ترکیب می‌کنند. بسیاری از پروژه‌ها این روزها یک SSG را انتخاب می‌کنند هر چند به رندرینگ سمت سرور نیاز نداشته باشند، زیرا راه‌حل‌هایی مانند Next یا Nuxt قابلیت‌های مفیدی مانند پشتیبانی از Markdown، باندل‌کننده ماژول، اجراکننده تست یکپارچه و غیره دارند.
اگر در مورد توسعه فرانت‌اند جدی هستید، باید نگاهی دقیق‌تر به پروژه‌های زیر بیندازید و در مورد آن‌ها قدری تجربیات داشته باشید:
– Next (React-based)
– Nuxt (Vue-based)
– Gatsby (React-based)
– Gridsome (Vue-based)
این پروژه‌ها احتمالاً در سال ۲۰۲۰ جزو ترندها خواهند بود، گرچه ممکن است تعداد آن‌ها بیشتر باشد.
مطالعه ادامه مطلب 👇👇
🔗 ۱۰ نکته مهم برای توسعه فرانت اند — راهنمای کاربردی — کلیک کنید (+)
📌 کانال اختصاصی آموزشی طراحی و توسعه وب
آخرین مطالب علمی، مقالات رایگان و ویدئوهای آموزشی طراحی و توسعه وب را در کانال اختصاصی [@FaraWebDev] دنبال کنید. 👇
@FaraWebDev — مطالب و آموزش‌های طراحی و توسعه وب فرادرس
بدیهی است که توسعه فرانت اند در سال ۲۰۲۰ یکی از رشته‌های پرطرفدار برنامه‌نویسی محسوب می‌شود. تا همین اواخر کافی بود که توسعه‌دهندگان فرانت‌اند مقداری با HTML ،CSS و شاید jQuery آشنا باشند تا بتوانند یک وبسایت تعاملی ایجاد کنند. اما امروزه توسعه‌دهندگان فرانت‌اند با اکوسیستم وسیع و مداوماً در حال تغییر از مهارت‌های توسعه، ابزارها، کتابخانه‌ها و فریمورک‌هایی که باید بیاموزند مواجه شده‌اند و باید زمان زیادی را صرف آموزش شخصی خودشان بکنند. تا انتهای این راهنما با ما همراه باشید.
══ فهرست مطالب ══
○ فریمورک‌های توسعه فرانت اند
○ تولیدکنندگان سایت استاتیک
○ JAMstack
○ PWA
○ GraphQL
○ ادیتورهای کد یا IDE-ها
○ تست کردن کدهای فرانت اند
○ کد تمیز
○ Git برای توسعه دهندگان فرانت اند
○ مهارت‌های نرم لازم برای توسعه دهندگان فرانت اند
○ سخن پایانی
🔸 فریمورک‌های توسعه فرانت اند
در سال ۲۰۲۰ احتمالاً شاهد یک دوئل بین ReactJS فیسبوک و VueJS قدرت‌گرفته از جامعه توسعه‌دهندگان خواهیم بود. ری‌اکت هم‌اینک دارای ۱۴۰هزار ستاره در گیت‌هاب است در حالی که تعداد ستاره‌های Vue در گیت‌هاب از آن بیشتر و برابر با ۱۵۳ هزار ستاره است. برای مقایسه باید اشاره کنیم که انگولار دارای ۵۳۰۰۰ ستاره است.
مقایسه حجم جستجوی کلمه React (خط آبی در تصویر زیر) در سال ۲۰۱۹، در برابر Vue (رنگ قرمز)، انگولار (رنگ زرد)، Svelte (رنگ سبز) از این فرضیه پشتیبانی می‌کند. چنان که می‌بینید Vue کمی بالاتر از ری‌اکت قرار دارد. انگولار این حجم از جستجو را ندارد و Svelte قطعاً هیچ نقشی در این مقایسه ندارد.
بنابراین در سال ۲۰۲۰ توسعه‌دهندگان فرانت‌اند که با فریمورک‌های جاوا اسکریپت کار می‌کنند یا قصد این کار را دارند، باید روی React یا Vue به عنوان گزینه‌های اصلی تمرکز کنند. انگولار نیز در صورتی که روی پروژه‌های سازمانی بزرگ کار می‌کنید گزینه معتبری محسوب می‌شود. اگر می‌خواهید در مورد این فریمورکها بیشتر بدانید می‌توانید به وبسایت ری‌اکت (+) و Vue.js (+) مراجعه کنید.
🔸 تولیدکنندگان سایت استاتیک
تولیدکنندگان سایت استاتیک قدرت رندرینگ سمت سرور (که برای سئو بسیار مهم است اما زمان بارگذاری اولیه را افزایش می‌دهند) را با اپلیکیشن‌های تک‌صفحه‌ای ترکیب می‌کنند. بسیاری از پروژه‌ها این روزها یک SSG را انتخاب می‌کنند هر چند به رندرینگ سمت سرور نیاز نداشته باشند، زیرا راه‌حل‌هایی مانند Next یا Nuxt قابلیت‌های مفیدی مانند پشتیبانی از Markdown، باندل‌کننده ماژول، اجراکننده تست یکپارچه و غیره دارند.
اگر در مورد توسعه فرانت‌اند جدی هستید، باید نگاهی دقیق‌تر به پروژه‌های زیر بیندازید و در مورد آن‌ها قدری تجربیات داشته باشید:
– Next (React-based)
– Nuxt (Vue-based)
– Gatsby (React-based)
– Gridsome (Vue-based)
این پروژه‌ها احتمالاً در سال ۲۰۲۰ جزو ترندها خواهند بود، گرچه ممکن است تعداد آن‌ها بیشتر باشد.
مطالعه ادامه مطلب 👇👇
🔗 ۱۰ نکته مهم برای توسعه فرانت اند — راهنمای کاربردی — کلیک کنید (+)
📌 کانال اختصاصی آموزشی طراحی و توسعه وب
آخرین مطالب علمی، مقالات رایگان و ویدئوهای آموزشی طراحی و توسعه وب را در کانال اختصاصی [@FaraWebDev] دنبال کنید. 👇
@FaraWebDev — مطالب و آموزش‌های طراحی و توسعه وب فرادرس
✳️ هفت ابزار مهم برای دیباگ فرانت اند — راهنمای کاربردی
اگر تاکنون در سمت فرانت کار کرده باشید، می‌دانید که دیباگ کردن اپلیکیشن‌ها تا چه حد دشوار است. به طور خاص در مورد جاوا اسکریپت، در صورتی که یک اشتباه کوچک انجام دهید، گاهی اوقات ممکن است به ساعت‌ها زمان برای دیباگ نیاز داشته باشید. با وجود انواع مختلف مرورگرها سیستم‌های عامل و دستگاه‌ها، بروز باگ امری اجتناب‌ناپذیر است. در این مقاله با ۷ ابزار مهم دیباگ فرانت اند آشنا خواهیم شد. این ابزارها به شما کمک می‌کنند که این مشکلات را یافته، عیب‌یابی و اصلاح کنید. بسته به موقعیت برخی از این ابزارها می‌توانند مفید‌تر از بقیه باشند.
══ فهرست مطالب ══
○ Developer Tools در مرورگرهای وب
○ Postman
○ CSS Lint
○ JSON Formatter & Validator
○ Sentry
○ JSHint
○ سخن پایانی
🔸 Developer Tools در مرورگرهای وب
هر مرورگر وب مدرن مجهز به ابزارهای قدرتمندی برای کمک به دیباگ اپلیکیشن‌ها است. این ابزار می‌تواند به سادگی گزاره‌های کنسول با console.log() ،popup-ها با alert() یا حتی مکث در اجرای کد با استفاده از گزاره‌های debugger باشد. این ابزارها به خصوص گزاره debugger برای کارهای دیباگ کردن بسیار مفید هستند. همچنین می‌توانید از زبانه network inspector یا CSS styles inspector این ابزارها برای ساده و سریع‌تر ساختن کارهای دیباگ استفاده کنید.
🔸 Postman
تقریباً همه اپلیکیشن‌های فرانت‌اند، درخواست‌ها و پاسخ‌های JSON را ارسال و دریافت می‌کنند. اپلیکیشن شما با یک API به چیزهای زیادی مانند احراز هویت انتقال داده‌های کاربر، و یا حتی چیزی مانند واکشی وضعیت کنونی آب و هوا وصل می‌شود. Postman (+) یکی از بهترین ابزارهای جاوا اسکریپت برای دیباگ درخواست‌ها و پاسخ‌ها محسوب می‌شود. این ابزار برای سیستم‌های ویندوز، مک و لینوکس عرضه شده است. Postman امکان ارسال سریع و آسان درخواست‌های REST ،SOAP و GraphQL را به صورت مستقیم فراهم ساخته است.
با استفاده از Postman می‌توان درخواست‌ها را دست‌کاری کرد، پاسخ‌ها را آنالیز و مشکلات را دیباگ نمود. این کار به خصوص در مواردی که نمی‌دانید مشکل در فرانت‌اند یا بک‌اند است، بسیار کمک مفیدی محسوب می‌شود.
مطالعه ادامه مطلب 👇👇
🔗 هفت ابزار مهم برای دیباگ فرانت اند — راهنمای کاربردی — کلیک کنید (+)
📌 کانال اختصاصی آموزشی طراحی و توسعه وب
آخرین مطالب علمی، مقالات رایگان و ویدئوهای آموزشی طراحی و توسعه وب را در کانال اختصاصی [@FaraWebDev] دنبال کنید. 👇
@FaraWebDev — مطالب و آموزش‌های طراحی و توسعه وب فرادرس
اگر تاکنون در سمت فرانت کار کرده باشید، می‌دانید که دیباگ کردن اپلیکیشن‌ها تا چه حد دشوار است. به طور خاص در مورد جاوا اسکریپت، در صورتی که یک اشتباه کوچک انجام دهید، گاهی اوقات ممکن است به ساعت‌ها زمان برای دیباگ نیاز داشته باشید. با وجود انواع مختلف مرورگرها سیستم‌های عامل و دستگاه‌ها، بروز باگ امری اجتناب‌ناپذیر است. در این مقاله با ۷ ابزار مهم دیباگ فرانت اند آشنا خواهیم شد. این ابزارها به شما کمک می‌کنند که این مشکلات را یافته، عیب‌یابی و اصلاح کنید. بسته به موقعیت برخی از این ابزارها می‌توانند مفید‌تر از بقیه باشند.
══ فهرست مطالب ══
○ Developer Tools در مرورگرهای وب
○ Postman
○ CSS Lint
○ JSON Formatter & Validator
○ Sentry
○ JSHint
○ سخن پایانی
🔸 Developer Tools در مرورگرهای وب
هر مرورگر وب مدرن مجهز به ابزارهای قدرتمندی برای کمک به دیباگ اپلیکیشن‌ها است. این ابزار می‌تواند به سادگی گزاره‌های کنسول با console.log() ،popup-ها با alert() یا حتی مکث در اجرای کد با استفاده از گزاره‌های debugger باشد. این ابزارها به خصوص گزاره debugger برای کارهای دیباگ کردن بسیار مفید هستند. همچنین می‌توانید از زبانه network inspector یا CSS styles inspector این ابزارها برای ساده و سریع‌تر ساختن کارهای دیباگ استفاده کنید.
🔸 Postman
تقریباً همه اپلیکیشن‌های فرانت‌اند، درخواست‌ها و پاسخ‌های JSON را ارسال و دریافت می‌کنند. اپلیکیشن شما با یک API به چیزهای زیادی مانند احراز هویت انتقال داده‌های کاربر، و یا حتی چیزی مانند واکشی وضعیت کنونی آب و هوا وصل می‌شود. Postman (+) یکی از بهترین ابزارهای جاوا اسکریپت برای دیباگ درخواست‌ها و پاسخ‌ها محسوب می‌شود. این ابزار برای سیستم‌های ویندوز، مک و لینوکس عرضه شده است. Postman امکان ارسال سریع و آسان درخواست‌های REST ،SOAP و GraphQL را به صورت مستقیم فراهم ساخته است.
با استفاده از Postman می‌توان درخواست‌ها را دست‌کاری کرد، پاسخ‌ها را آنالیز و مشکلات را دیباگ نمود. این کار به خصوص در مواردی که نمی‌دانید مشکل در فرانت‌اند یا بک‌اند است، بسیار کمک مفیدی محسوب می‌شود.
مطالعه ادامه مطلب 👇👇
🔗 هفت ابزار مهم برای دیباگ فرانت اند — راهنمای کاربردی — کلیک کنید (+)
📌 کانال اختصاصی آموزشی طراحی و توسعه وب
آخرین مطالب علمی، مقالات رایگان و ویدئوهای آموزشی طراحی و توسعه وب را در کانال اختصاصی [@FaraWebDev] دنبال کنید. 👇
@FaraWebDev — مطالب و آموزش‌های طراحی و توسعه وب فرادرس
✳️ ۸ ابزار شگفت انگیز برای توسعه دهندگان | فهرست کاربردی
در این مقاله برخی از ابزارهایی را معرفی می‌کنیم که جامعه توسعه‌دهندگان به آن‌ها عشق می‌ورزند. این ابزارها اختصاص به هیچ دسته خاصی از توسعه‌دهندگان ندارند و از این رو مطمئن باشید که دست کم برخی از آن‌ها را مفید خواهید یافت. با ما تا انتهای فهرست کاربردی ۸ ابزار شگفت انگیز برای توسعه دهندگان همراه باشید.
══ فهرست مطالب ══
○ Cloudcraft
○ BundlePhobia
○ Figma
○ Insomnia
○ FontFlipper
○ اکستنشن کروم به نام VisBug
○ RIVE
○ MIRO
○ سخن پایانی
🔸 Cloudcraft
Cloudcraft (+) ابزاری برای توسعه‌دهندگان بک‌اند است.
همه توسعه‌دهندگان بک‌اند وظایف خود را در حوزه کاری‌شان برنامه‌ریزی می‌کنند. به طور خاص زمانی که از AWS استفاده می‌کنیم، سرویس‌های مختلفی وجود دارند که نقش ایفا می‌کنند. اما به جای این که این کار را روی یک ابزار رسم مسطح خسته‌کننده انجام دهیم، می‌توانیم از Cloud Craft بهره بگیریم.
Cloud Craft یک اینترفیس کشیدن و رها کردن (drag and drop) کاملاً ساده و سرراست برای ادغام سرویس‌های مختلف AWS ارائه می‌کند. این ابزار نه تنها برای برنامه‌ریزی بلکه برای بودجه‌بندی نیز عملکرد مناسبی دارد.
🔸 BundlePhobia
BundlePhobia (+) ابزاری برای توسعه‌دهندگان فرانت‌اند است.
BundlePhobia به «یافتن هزینه افزودن یک پکیج npm به یک باندل» کمک می‌کند. یعنی با استفاده از BundlePhobia می‌توانید بفهمید که افزودن یک پکیج npm چه قدر حجم باندل شما را افزایش می‌دهد. زمانی که روی فریمورک فرانت‌اند کار می‌کنیم، همواره تلاش می‌کنیم که حجم باندل در کمترین حد باشد تا صفحه بارگذاری اولیه برای کاربران در بهینه‌ترین حالت ممکن باشد.
شما حتی می‌توانید فایل package.json را روی این وبسایت بارگذاری کنید تا بفهمید در آن از کدام پکیج‌ها استفاده شده است. این یک ابزار کاملاً ضروری برای همه توسعه‌دهندگان حرفه‌ای محسوب می‌شود.
مطالعه ادامه مطلب 👇👇
🔗 ۸ ابزار شگفت انگیز برای توسعه دهندگان | فهرست کاربردی — کلیک کنید (+)
📌 کانال اختصاصی آموزشی طراحی و توسعه وب
آخرین مطالب علمی، مقالات رایگان و ویدئوهای آموزشی طراحی و توسعه وب را در کانال اختصاصی [@FaraWebDev] دنبال کنید. 👇
@FaraWebDev — مطالب و آموزش‌های طراحی و توسعه وب فرادرس
در این مقاله برخی از ابزارهایی را معرفی می‌کنیم که جامعه توسعه‌دهندگان به آن‌ها عشق می‌ورزند. این ابزارها اختصاص به هیچ دسته خاصی از توسعه‌دهندگان ندارند و از این رو مطمئن باشید که دست کم برخی از آن‌ها را مفید خواهید یافت. با ما تا انتهای فهرست کاربردی ۸ ابزار شگفت انگیز برای توسعه دهندگان همراه باشید.
══ فهرست مطالب ══
○ Cloudcraft
○ BundlePhobia
○ Figma
○ Insomnia
○ FontFlipper
○ اکستنشن کروم به نام VisBug
○ RIVE
○ MIRO
○ سخن پایانی
🔸 Cloudcraft
Cloudcraft (+) ابزاری برای توسعه‌دهندگان بک‌اند است.
همه توسعه‌دهندگان بک‌اند وظایف خود را در حوزه کاری‌شان برنامه‌ریزی می‌کنند. به طور خاص زمانی که از AWS استفاده می‌کنیم، سرویس‌های مختلفی وجود دارند که نقش ایفا می‌کنند. اما به جای این که این کار را روی یک ابزار رسم مسطح خسته‌کننده انجام دهیم، می‌توانیم از Cloud Craft بهره بگیریم.
Cloud Craft یک اینترفیس کشیدن و رها کردن (drag and drop) کاملاً ساده و سرراست برای ادغام سرویس‌های مختلف AWS ارائه می‌کند. این ابزار نه تنها برای برنامه‌ریزی بلکه برای بودجه‌بندی نیز عملکرد مناسبی دارد.
🔸 BundlePhobia
BundlePhobia (+) ابزاری برای توسعه‌دهندگان فرانت‌اند است.
BundlePhobia به «یافتن هزینه افزودن یک پکیج npm به یک باندل» کمک می‌کند. یعنی با استفاده از BundlePhobia می‌توانید بفهمید که افزودن یک پکیج npm چه قدر حجم باندل شما را افزایش می‌دهد. زمانی که روی فریمورک فرانت‌اند کار می‌کنیم، همواره تلاش می‌کنیم که حجم باندل در کمترین حد باشد تا صفحه بارگذاری اولیه برای کاربران در بهینه‌ترین حالت ممکن باشد.
شما حتی می‌توانید فایل package.json را روی این وبسایت بارگذاری کنید تا بفهمید در آن از کدام پکیج‌ها استفاده شده است. این یک ابزار کاملاً ضروری برای همه توسعه‌دهندگان حرفه‌ای محسوب می‌شود.
مطالعه ادامه مطلب 👇👇
🔗 ۸ ابزار شگفت انگیز برای توسعه دهندگان | فهرست کاربردی — کلیک کنید (+)
📌 کانال اختصاصی آموزشی طراحی و توسعه وب
آخرین مطالب علمی، مقالات رایگان و ویدئوهای آموزشی طراحی و توسعه وب را در کانال اختصاصی [@FaraWebDev] دنبال کنید. 👇
@FaraWebDev — مطالب و آموزش‌های طراحی و توسعه وب فرادرس
