خانه / بایگانی برچسب: اسکریپت

بایگانی برچسب: اسکریپت

طراحی تقویم کاملاً ساده با استفاده از CSS، Moment و Vue — راهنمای مقدماتی

در برخی موارد به دلایلی مانند نوع طراحی یک وب‌سایت و یا دلایل دیگر، نیاز هست که یک کامپوننت با طراحی کاملاً ساده داشته باشیم. طراحی چنین کامپوننتی با استفاده از grid در CSS کاملاً سرراست است. ما در این مقاله به توضیح این فرایند می‌پردازیم و آن را به صورت دینامیک درمی‌آوریم تا بتوان تاریخ‌های مختلف را در آن انتخاب کرد. قبل از هر کار باید اطمینان یابیم عنصری داریم که می‌توانیم اپلیکیشن Vue را روی آن راه‌اندازی کنیم. به این منظور از یک عنصر با id به صورت «calendar» استفاده می‌کنیم. اسکریپت Vue.js (+) را به پروژه اضافه کرده و یک اپلیکیشن ساده راه‌اندازی می‌کنیم: const app = new Vue({ el: '#calendar', data() { return { days: [] } }, mounted() { // load days } }) اینک moment (+) را در پروژه خود می‌گنجانیم و کد ()mounted مورد نیاز برای پر کردن روزهای ماه را می‌نویسیم. به این منظور از چند تابع moment همراه با منطق ES6 استفاده می‌کنیم. تابع ()mounted چنین است: let monthDate = moment().startOf('month') this.days = [...Array(monthDate.daysInMonth())].map((_, i) => { ret..

توضیحات بیشتر »

Webpack برای ساخت اپلیکیشن های مدرن — به زبان ساده

اغلب افرادی که از فریمورک‌های فرانت‌اند مختلف مانند ReactJS, Vue, Angular و غیره استفاده می‌کنند، با Webpack آشنا هستند و به طور متناوب از آن استفاده می‌کنند. اما باید بدانید که Webpack صرفاً برای استفاده به همراه فریمورک‌ها نیست. شما می‌توانید از Webpack بر روی جاوا اسکریپت محض نیز استفاده کنید. ما در این نوشته به توضیح در مورد Webpack و کارهایی که در پیکربندی‌های مختلف می‌توان انجام داد پرداخته‌ایم. Webpack چیست؟ Webpack ابزاری است که ماژول‌های مختلف جاوا اسکریپت را انتخاب کرده و آن‌ها را در یک ماژول جاوا اسکریپت منفرد ادغام می‌کند به طوری که بتوان آن را به مرورگر کاربران ارسال کرد. البته شاید این تعریف، کاری که Webpack انجام می‌دهد را بیش از حد ساده‌سازی کرده باشد؛ اما برای افرادی که با ماهیت آن آشنا نیستند، مناسب خواهد بود. برای توصیف بیشتر باید گفت که Webpack یک «نرم‌افزار بسته‌بندی» (bundler) است که به دنبال ماژول‌های دارای وابستگی، (یعنی فایل‌های جاوا اسکریپت که به کدهایی در فایل‌های دیگر نیاز دارند) می‌گردد، آن‌ها را در هم ادغام می‌کند و سپس یک فایل جاوا اسکریپت می‌سازد که ..

توضیحات بیشتر »

رندر کادرهای Modal در React — به زبان ساده

کادرهای Modal می‌توانند موضوعات پیچیده‌ای باشند، زیرا روش ری‌اکت برای سازماندهی DOM چنین است. اگر با مبانی ری‌اکت آشنا باشید، می‌دانید که کل اپلیکیشن یک کامپوننت است که معمولاً نامیده می‌شود و به عنوان یک فرزند به یک

به نام root# الحاق می‌شود. فایل index.html چیزی مانند زیر است: فایل public/index.html برای ایجاد ری‌اکت زمانی که کامپوننت در DOM رندر شد، عنصر واقعی
در HTML با id #root کل اپلیکیشن React را درون خود رندر می‌کند. در نتیجه، این وضعیت که کامپوننت‌های اپلیکیشن React کاملاً تو در تو باشند، امری رایج محسوب می‌شود. منظور ما از تو در تو، ده‌ها سطح و یا بیشتر است. بنابراین اگر یکی از این سطوح کاملاً عمیق در لایه‌های تو در تو بخواهد یک modal را نمایش دهد، با برخی مشکلات جدی CSS مواجه می‌شود. Modal-ها یک لایه روی صفحه قرار می‌دهند و از این رو اولویت نمایشی بالاتری نسبت به همه عناصر دیگر دارند. اگر بخواهید آن را برحسب z-index تعیین کنید، باز هم کاملاً تو در تو خواهد بود و عناصر والد در سطوح بالاتر CSS تقدم خواهند داشت. بنابراین به جای این که با CSS سر و..

توضیحات بیشتر »

ساخت اپلیکیشن دسکتاپ با CSS ،HTML و جاوا اسکریپت — به زبان ساده

در این مقاله به بررسی چگونگی استفاده از Electron برای ایجاد اپلیکیشن‌های دسکتاپ به کمک فناوری‌های وب مانند HTML ،CSS و جاوا اسکریپت می‌پردازیم. ما می‌توانیم از الکترون برای ساخت اپلیکیشن‌های دسکتاپ استفاده کنیم. این اپلیکیشن‌ها در پلتفرم‌های مختلفی مانند ویندوز، Mac، لینوکس و غیره کار می‌کنند. الکترون در واقع ترکیبی از NodeJS و Chromium در یک runtime واحد است. این امر ما را قادر می‌سازد که کد HTML ،CSS و جاوا اسکریپت را به صورت یک اپلیکیشن دسکتاپ اجرا کنیم. Electron Forge اگر قرار است از الکترون به صورت مستقیم استفاده شود، در این صورت برخی مراحل راه‌اندازی دستی پیش از ساختن اپلیکیشن مورد نیاز خواهد بود. ضمناً اگر بخواهید از Angular ،React ،Vue یا دیگر فریمورک‌ها یا کتابخانه‌ها استفاده کنید باید به صورت دستی آن‌ها را پیکربندی کنید. Electron Forge موجب تسهیل امور فوق می‌شود. Electron Forge اپلیکیشن‌های پیش‌ساخته‌ای با انگولار، ویو و دیگر فریمورک‌ها ارائه می‌کند تا از مراحل راه‌اندازی دستی جلوگیری شود. همچنین یک روش آسان برای ساخت و بسته‌بندی اپلیکیشن ارائه کرده است. «الکترون فورج» ویژگ..

توضیحات بیشتر »

چگونه یک سیستم عامل طراحی کنیم؟ — به زبان ساده

اگر تاکنون با رایانه کار کرده باشید، احتمالاً در مورد طرز کار سیستم عامل در سطوح پایین کنجکاو شده‌اید و یا حتی ممکن است خواسته باشید در مورد این که چگونه می‌توان یک سیستم عامل ایجاد کرد سؤالاتی به ذهنتان رسیده باشد. این که گفته شود توسعه کرنل کار دشواری است، به هیچ وجه حق مطلب را ادا نمی‌کند. در واقع این کار اوج برنامه‌نویسی محسوب می‌شود. در این راهنما ابزارهای پایه‌ای مورد نیاز برای این منظور را معرفی کردیم و یک سیستم عامل ساده را در C و x86 Assembly پیاده‌سازی خواهیم کرد. این تصویری از صفحه سیستم عامل Basilica است که در این نوشته قصد داریم آن را ایجاد کنیم. سیستمی که قصد داریم توسعه دهیم، به افتخار Terry Davis، توسعه‌دهنده تازه درگذشته TempleOS به صورت Basilica OS نامگذاری شده است. این سیستم بسیار ساده خواهد بود و به عنوان یک مقدمه برای توسعه سیستم عامل محسوب می‌شود. از این رو قصد نداریم هیچ موضوع مرتبط با نظریه سیستم عامل مانند قالب‌های اجرایی، ارتباط سریال و غیره را مطرح کنیم. ما پشتیبانی از کیبورد را در سیستم خود نخواهیم داشت؛ با این حال، یک سیستم عامل اولیه می‌سازیم. شروع به پیا..

توضیحات بیشتر »

طراحی یک chatbot با استفاده از تلگرام و پایتون (بخش اول) — صفر تا صد

تلگرام یک اپلیکیشن پیام‌رسانی موبایل و دسکتاپ است. یکی از بهترین امکانات تلگرام ربات‌های آن هستند. هر کس می‌تواند ربات‌های خاص خود را در تلگرام ایجاد کند. در این راهنما یک چت بات با استفاده از پایتون می‌سازیم که در زمان آغاز به کار، خوشامدگویی می‌کند و همچنین دستورهایی برای تبدیل پیام‌ها به حالت حروف بزرگ و بازگشت دادن آن به کاربر در خود دارد. ما ربات خود را روی پلتفرم ابری Heroku توزیع می‌کنیم. ربات چیست؟ ربات‌ها در تلگرام یک کاربر خودکار هستند که می‌توانند برخی وظایف خاص را اجرا کنند. برای نمونه بات می‌تواند بهترین قیمت یک محصول را از وب‌سایت‌های فروشگاهی دریافت کند. اگر چنین رباتی وجود نداشته باشد، مجبور هستیم تک تک به همه فروشگاه‌های آنلاین سر بزنیم و محصول را انتخاب کرده و با وارد کردن کوئری جستجو نتیجه را دریافت کنیم. اگر از ربات به این منظور استفاده بکنیم، صرفاً نام محصول را به ربات می‌دهیم و ربات نتیجه را به ما بازمی‌گرداند. این وضعیت باعث سرعت و سهولت زیادی می‌شود. تنظیمات اولیه پیش از آن که اقدام به ساختن ربات خود بکنیم، باید یک حساب کاربری در تلگرام ایجاد بکنیم. به این من..

توضیحات بیشتر »

توسعه اپلیکیشن به روش بهبود پیشرونده (Progressive Enhancement) — به زبان ساده

«بهبود پیشرونده» (Progressive Enhancement) یا به اختصار PE یک روش قدرتمند برای توسعه وب اپلیکیشن‌ها محسوب می‌شود. تعریف رسمی آن بر اساس اطلاعات ویکی‌پدیا چنین است: بهبود پیش‌رونده یک راهبرد برای طراحی وب است که تأکید دارد ابتدا عناصر اصلی صفحه وب بارگذاری شوند. در این راهبرد متعاقباً لایه‌های فرعی‌تر و از نظر فنی کم‌اهمیت‌تر مربوط به ارائه و نمایش محتوای صفحه تا حدی که اتصال مرورگر/اینترنت کاربر اجازه می‌دهد، ‌اضافه می‌شوند. مزیت‌های این راهبرد این است که همه افراد می‌توانند به محتوا و کارکردهای مقدماتی یک صفحه وب دسترسی داشته باشند و از هر نوع مرورگر یا اتصال اینترنتی استفاده کنند. همچنین نسخه بهبودیافته‌ای از صفحه برای افرادی که از نرم‌افزارهای مرورگر پیشرفته‌تر یا پهنای باند بالاتر استفاده می‌کنند عرضه می‌شود. به طور خلاصه،‌ راهبرد بهبود پیش‌رونده موجب می‌شود که تجربه کاربری مقدماتی و پشتیبانی متقابل از چند مرورگر ارائه شود و بدین ترتیب پایداری بیشتری به دست آید. راهبرد PE شامل مفاهیم اصلی زیر است: محتوای اصلی باید روی همه مرورگرهای وب در دسترس باشد. کارکردهای اولیه باید روی ه..

توضیحات بیشتر »

پیاده‌سازی یک رابط خط فرمان مناسب با پایتون — راهنمای کاربردی

در این مقاله روش نوشتن اینترفیس خط فرمان در پایتون جهت ایجاد بهره‌وری و ساده‌سازی امور در تیم‌های کاری آموزش داده می‌شود. توسعه دهنگان پایتون همواره از اینترفیس‌های خط فرمان استفاده می‌کنند و بدین جهت چنین رابط‌هایی را می‌نویسند. برای نمونه در پروژه‌های «علم داده» (Data Sciense) می‌توان چندین اسکریپت از خط فرمان برای آموزش دادن مدل‌ها و محاسبه دقت الگوریتم‌ها اجرا کرد. به همین دلیل است که یکی از بهترین روش‌ها برای بهبود بهره‌وری این است که اسکریپت‌ها به خصوص زمانی که چند توسعه‌دهنده روی پروژه واحدی کار می‌کنند؛ تا حد امکان ساده و سرراست باشند. به منظور دستیابی به چنین وضعیتی 4 راهنمای کلی پیشنهاد می‌شوند: در تمام موارد ممکن باید مقادیر پیش‌فرض برای آرگومان‌ها تعیین شوند. همه موارد خطا (برای نمونه نبود آرگومان، نوع نادرست یا فایل ناموجود) باید مدیریت شوند. همه آرگومان‌ها و گزینه‌ها باید مستندسازی شوند. یک نوار پیشرفت باید برای وظایف غیر آنی ارائه شود. بررسی یک مثال ساده مواردی که در راهنمای کلی فوق پیشنهاد کردیم را در یک مثال ساده بررسی می‌کنیم. این مثال به یک اسکریپت برای رمزنگاری ..

توضیحات بیشتر »

بصری سازی یک درخت تصمیم از جنگل تصادفی در پایتون با استفاده از Scikit-Learn — صفر تا صد

در این نوشته به معرفی یک ابزار مفید در پایتون جهت بصری‌سازی درخت تصمیم می‌پردازیم که برای درک مدل بسیار به کار می‌آید. کد کامل این مقاله را می‌توانید در این ریپوی گیت‌هاب (+) مشاهده کنید. کافی است آن را به نت‌بوک ژوپیتر یا اسکریپت پایتون کپی کنید و با جایگزینی داده‌ها به اجرای آن با استفاده از Scikit-Learn بپردازید. from sklearn.datasets import load_iris iris = load_iris() # Model (can also use single decision tree) from sklearn.ensemble import RandomForestClassifier model = RandomForestClassifier(n_estimators=10) # Train model.fit(iris.data, iris.target) # Extract single tree estimator = model.estimators_[5] from sklearn.tree import export_graphviz # Export as dot file export_graphviz(estimator, out_file='tree.dot', feature_names = iris.feature_names, class_names = iris.target_names, rounded = True, proportion = False, precision = 2, filled = True) # Convert to png using system command (requires Graphviz) from subprocess import call call(['dot', '-Tpng', ..

توضیحات بیشتر »

چگونه یک بات ساده جستجوی آپارتمان را در کمتر از ۳۰ دقیقه بنویسیم؟ —- صفر تا صد

جستجوی آپارتمان در اغلب موارد کاری خسته کننده است. در این راهنما شیوه ساخت یک بات که در این مسیر به شما کمک می‌کند را آموزش می‌دهیم. بدین ترتیب دیگر مجبور نخواهید بود نتایج جستجوی خود را به طور مرتب رفرش کنید. چارچوب در شهر مونترال فصل آغاز کرایه آپارتمان‌ها تاریخ مشخصی است و در ابتدای ماه جولای آغاز می‌شود و با طول 12 ماه در انتهای ژوئن سال بعد پایان می‌پذیرد. با این که ممکن است فکر کنید این وضعیت با افزایش دسترسی‌پذیری و انتظارات موجب ساده‌تر شدن امور می‌شود؛ اما در عمل باعث می‌شود که رقابت شدیدی پدید آید. در این موارد باید در طی بازه محدودی هر روز صبح از خواب بیدار شوید و صفحه وب‌سایت موتور جستجوی املاکی مانند kijiji را باز کرده و ایمیل‌هایی در خصوص همه آگهی‌های جدید ارسال کنید. همین فرایند در زمان ظهر و عصر و پیش از خواب نیز تکرار می‌شود. نرخ پاسخ دادن به ایمیل‌ها بسیار پایین و شاید کمتر از 10 درصد است و پاسخ‌هایی نیز که دریافت می‌شوند، در اغلب موارد نامطلوب هستند. مرحله بعد این است که تلفن را بردارید و شانس خود را بیشتر امتحان کنید. صاحبان املاک پاسخ‌دهی بیشتری دارند و این بار ..

توضیحات بیشتر »