https://virgool.io/feed/@m_92971875 من آنم که رستم بُوَد پهلوان!!! fa 2026-04-15 09:08:11 https://files.virgool.io/upload/users/1493514/avatar/uSkpOA.jpeg?height=120&width=120 https://virgool.io/@m_92971875 https://virgool.io/@m_92971875/%D9%88%D8%A7%D8%AD%D8%AF%D9%87%D8%A7%DB%8C-%D8%A7%D9%86%D8%AF%D8%A7%D8%B2%D9%87-%DA%AF%DB%8C%D8%B1%DB%8C-%D8%AF%D8%B1-css-iag1a9953fb2 برای بیان بعضی از خصوصیات در css نیاز به واحدهای اندازه‌گیری داریم؛ مثل عرض و ارتفاع یا margin و padding و غیره.اما واحدهای زیادی در css وجود دارد که باعث می‌شود، انتخاب واحد مناسب چالشی در کار برنامه نویس‌ها باشد.واحدها به دو دسته کلی تقسیم می‌شوند:مطلق یا Absoluteنسبی یا Relativeبا استفاده از واحدهای مطلق همواره مقداری ثابت خواهیم داشت. به طور مثال، یک سانتی متر همیشه یک سانتی متر است، در هر حالتی مقداری مشخص است.اما در مقابل، واحدهای نسبی در حالات مختلف مقدارهای متفاوتی خواهند داشت. مثلا وقتی از درصد استفاده کنیم و بگوییم یک درصد، نمی‌توانیم دقیقا مقدار مشخصی را متصور شویم. یک درصد از هزار، برابر با ده می‌شود و یک درصد از دو هزار، برابر با بیست.واحدهای مطلق در css شامل موارد زیر است:واحدهای فیزیکی (in, cm, mm, pt, pc)پیکسل (px)رابطه بین واحدهای فیزیکی به این شکل است1in = 2.54cm = 25.4mm = 72pt = 6pcاستفاده از واحدهای فیزیکی در دنیای وب متداول نیست و پیشنهاد هم نمی‌شود.اما پیکسل بر خلاف واحدهای فیزیکی بسیار پر کاربرد است. شاید تعریفی از مفهوم پیکسل در ذهن داشته باشید، اما باید بدانید تعریف پیکسل در css به شکل نقطه در اینچ است و این یعنی:1px = 1/96 inواحدهای نسبی در دنیای وب امروز که بحث واکنشگرایی بسیار اهمیت دارد گزینه بهتری نسبت به واحدهای مطلق هستند.واحدهای نسبی پرکاربرد شامل:percent (%)emremvw - vhدرصد مشخصا اشاره دارد به عنصر پدر هر عنصر و مثلا اگر عرض یک عنصر برابر با 50% باشد یعنی، عرض آن نصف عرض عنصر پدر همان عنصر است.واحد em نمایانگر ویژگی font-size می‌باشد. یعنی 1em برابر مقداری است که برای ویژگی font-size عنصر تعیین می شود. اگر em برای خود font-size استفاده شود آنگاه برای محسابه کردن em باید به font-size پدر عنصر مورد نظر مراجعه کنیم.font-size: 20px; padding: 2em; /* 2 * 20 = 40px */واحد rem کاملا شبیه به em عمل می‌کند با این تفاوت که به جای اینکه مبنای آن font-size عنصر مورد نظر باشد، اندازه فونتی است که برای عنصر ریشه یا همان html توسط ویژگی font-size تعیین شده است.به قابی که در آن وب سایت را می‌بینیم اصطلاحا viewport می‌گویند و دو واحد vh و vw وابسته به اندازه viewport هستند. vh مخفف شده‌ی viewport height و معنی آن درصدی از ارتفاع و vw مخفف viewport width و معنی آن درصدی از عرض viewport است.برای مطالعه بیشتر در این مورد می‌توانید به سایت w3schools هم سر بزنید. امیرحسین نصیری پور امیرحسین نصیری پور Thu, 17 Feb 2022 01:32:38 +0330 https://virgool.io/@m_92971875/%D9%81%D9%84%DA%A9%D8%B3-%D8%A8%D8%A7%DA%A9%D8%B3-%DA%86%DB%8C%D8%B3%D8%AA-flexbox-fyskhvecntb3 فلکس باکس یک ماژول CSS3 برای چیدمان، ترازبندی و تقسیم فضای بین عناصر موجود درصفحه است.تا قبل از معرفی فلکس باکس، برای هر کدام از این کارها راهی وجود داشت که خب سختی‌های خود را داشتند و در خیلی از موارد نیازمند استفاده از css tricks بودیم (مثل استفاده از float و روش clearfix برای چیدمان).اما حالا با خیال راحت و بسیار ساده می‌توانیم از فلکس باکس استفاده کنیم.اگر قصد مدیریت سه div را دارید، کافیست در css در عنصر پدر یا همان نگه دارنده‌ی آنها، پراپرتی display را برابر با flex قرار دهید و تمام؛ حالا می‌توانید به راحتی کار چیدمان، ترازبندی و تقسیم فضای بین عناصر موجود درصفحه را انجام دهید.در اینجا قصد آموزش فلکس باکس را ندارم اما برای نشان دادن توانایی‌ها و سادگی فلکس باکس به طور مختصر به سه پراپرتی از فلکس باکس اشاره می‌کنم.چیدمان:حالا به کمک فلکس باکس می‌توانید به راحتی عناصر را به صورت تک بعدی کنار هم قرار دهید. منظور از تک بعدی، قرار دادن عناصر در یکی از محورهای x یا y است.و برای مشخص کردن محور و همینطور جهت قرارگیری عناصر می‌توانید از پراپرتی flex-direction استفاده کنید و مقادیر داخل عکس را به آن بدهید.ترازبندی:همینطور برای ترازبندی عناصر از پراپرتی align-items استفاده می‌کنیم.تقسیم فضای بین عناصر:تقسیم فضای بین عناصر نیز بسیار ساده است و تنها باید از پراپرتی justify-content استفاده کرد.اگر علاقمند به یادگیری فلکس باکس هستید می‌توانید از سایت w3schools استفاده کنید و از این به بعد لذت صفحه آرایی با فلکس باکس را بچشید.همینطور به کمک بازی آنلاین FLEXBOX FROGGY مفاهیم را در ذهن خود تثبیت کنید. امیرحسین نصیری پور امیرحسین نصیری پور Mon, 14 Feb 2022 17:07:56 +0330 https://virgool.io/@m_92971875/%D8%AE%D8%B4%D8%AA-%D8%A7%D9%88%D9%84-%D9%87%D8%A7%D8%B3%D8%AA-host-%D9%88-%D8%AF%D8%A7%D9%85%D9%86%D9%87-domain-qbsd2ddqlrwh خشت اول چون نهد معمار کجتا ثریا می‌رود دیوار کجفرض کنید قصد ساختن یک آپارتمان را دارید. اولین قدم پیدا کردن "فضایی برای ساخت و ساز" است. پس همین کار را انجام می‌دهید و زمینی در "خیابان x نرسیده به میدان y نبش کوچه z پلاک 1" را خریداری می‌کنید.حال فرض کنید قصد دارید وب سایتی داشته باشید.نیاز دارید به "فضایی که فایل‌ها و فولدرهای سایت داخل آن باشد". در حقیقت این فضا در ابتدای کار بر روی هارد شما بوده؛ اما برای انتشار وب سایت در سطح اینترنت نیاز به فضایی دارید که قابل دسترس از طریق شبکه جهانی باشد.طبیعتا برای دسترسی به این فضا نیاز به یک آدرس داریم؛ مثل: "www.domain.com".به این فضا هاست و به این آدرس دامنه می‌گویند.ممکن است دامنه را با URL اشتباه بگیرید؛ برای جلوگیری از این اشتباه به تصویر زیر دقت کنید.همانطور که در تصویر مشخص است، یک دامنه شامل بخش‌های مختلف است. TLD که به آن پسوند می‌گوییم می‌تواند پسوندهای عمومی مثل com. باشد یا پسوندهای ملی مثل ir. و یا پسوندهای خاص مثل co.ir. . نام دامنه که از تركیب 3 الی 64 حرف ، عدد یا خط تیره (بدون فاصله) تشكیل می‌شود.امروزه یکی از دغدغه‌های خیلی جدی توسعه دهندگان وب امنیت است. برای حفظ امنیت سایت خود باید مسائل مختلفی را مد نظر داشته باشیم که خب یکی از این مسائل، هاست امن است.به همین منظور باید سراغ شرکت‌های معتبر ارائه دهنده خدمات هاست رفته و از امنیت هاست مطمئن باشیم. استفاده از سیستم‌های امنیتی شامل آنتی ویروس، آنتی اسپم، فایروال سخت‌افزاری و نرم‌افزاری و… نقش اساسی در برخورد با حملات ایفا می‌کند. امیرحسین نصیری پور امیرحسین نصیری پور Wed, 09 Feb 2022 10:57:13 +0330 https://virgool.io/@m_92971875/%D8%B4%D9%88%D9%81%D8%A7%DA%98-%D8%A8%D9%87-%D9%85%D8%AB%D8%A7%D8%A8%D9%87-%D9%88%D8%A8-%D8%B3%D8%A7%DB%8C%D8%AA-%D9%81%D8%B1%D8%A7%D9%86%D8%AA-%D8%A7%D9%86%D8%AF-%DA%86%DB%8C%D8%B3%D8%AA-pwes8tiarxgd متن زیر را بدون در نظر گرفتن محتوای داخل پرانتز بخوانید:طراح ( UI/UX Designer )، ظاهر شوفاژ ( web site ) ما را طراحی می کند. اما مشخصا یک طراحی، کاربردی برای ما نخواهد داشت.از سوی دیگر یک مهندس ( Back End Developer ) شوفاژخانه ( Back End ) را می سازد. اما باز هم شوفاژخانه به تنهایی خانه ما را گرم نخواهد کرد.درست متوجه شدید؛ ما نیاز به یک شوفاژ ( Front End ) داریم که پیشتر توسط طراح ( UI/UX Designer ) طراحی شده و ماحصل فعالیت شوفاژخانه ( Back End ) را که همان گرما هست به ما منتقل می کند.حالا متن بالا را با محتوای پرانتز بخوانید.با اینکه معتقدم مثال ها لزوما تطابق صد در صدی با منظور ما را نخواهند داشت، اما مثال بالا برای شروع درک ما از پروسه ی ساخت وب سایت خوب است.در این مقاله مشخصا به مفهوم فرانت اند خواهیم پرداخت.اگر هنوز دقیقا متوجه معنی فرانت اند نشدید با مثالی واقعی توضیح خواهم داد:وب سایت ها ابتدا توسط طراحان در نرم افزارهای گرافیکی ( مثل ادوبی ایکس دی، فیگما و … ) طراحی می شوند.سپس یک برنامه نویس فرانت اند طرح گرافیکی را به صورت کدهای قابل اجرا در مرورگر پیاده سازی می کند.در نهایت توسط برنامه نویس بک اند، قالب ساخت شده پویا می شود ( منظور از پویا شدن اتصال به پایگاه داده، قابلیت ادیت یا اضافه کردن مطالب با پنل مدیریتی و … است ).برای تبدیل طرح گرافیکی به قالب، از HTML و CSS و JavaScript استفاده می کنیم. در حقیقت با HTML ساختار اصلی و بدنه را ایجاد می کنیم؛ با CSS استایل ها ( مثل رنگ ها، اندازه ها و … ) را به ساختار اضافه می کنیم و در نهایت با JavaScript ساختار های پیچیده تر مثل اسلایدرها، اعتبار سنجی فرم ها و … را برنامه نویسی می کنیم.اگر علاقمند به یادگیری فرانت اند هستید، می توانید از مسیر ( road map ) زیر استفاده کنید. امیرحسین نصیری پور امیرحسین نصیری پور Mon, 07 Feb 2022 12:35:24 +0330