ساخت یک برنامه ساده‌ی جاوااسکریپتی با استفاده از الگوی MVC
در این مقاله قصد داریم با استفاده از جاوااسکریپت خالص، یک برنامه‌ی ساده را با الگوی MVC انجام دهیم. این برنامه، عملیات CRUD را پیاده سازی میکند و تنها به سه فایل index.html , script.js , style.css نیاز دارد و از هیچ کتابخانه یا فریم ورک دیگری در آن استفاده نمیکنیم. در الگوی MVC M مخفف Model می‌باشد و کار مدیریت داده‌ها را بر عهده دارد. V مخفف View می‌باشد و وظیفه‌ی نمایش داده‌ها به کاربر را بر عهده دارد. C مخفف Control ...
چرا در جاوااسکریپت نیازی به استفاده از loopها ندارید!
در زبان‌های برنامه نویسی، از loopها برای پیمایش عناصر یک مجموعه استفاده میشود. این پیمایش ممکن است صرفا جهت نمایش و یا دستکاری نمودن عناصر مجموعه، مورد استفاده قرار بگیرد (دستوراتی نظیر for,while,do while). کد زیر را در نظر بگیرید که در آن قصد داریم عناصر مجموعه‌ای را تبدیل به حروف بزرگ کنیم. اینکار به طور معمول با استفاده از loopهای معمول، به شکل زیر انجام میشود: let names = ["Jack", "Jecci", "Ram", "Tom"]; let upperCaseNames = [ ...
تحلیل و بررسی ده روش آسیب پذیری نرم افزار بر اساس متدولوژی OWASP - قسمت دوم (Cross Site Scripting (XSS - بخش اول: XSS چیست و چگونه کار میکند؟
XSS یکی از شایع‌ترین آسیب پذیری‌های برنامه‌های تحت وب به حساب می‌آید و هنگامی رخ میدهد که برنامه، از ورودی‌های غیر معتبر یا کدگذاری نشده‌ی کاربر، در خروجی تولید شده، استفاده نماید. در این روش مهاجم مستقیماً قربانی را مورد هدف قرار نمیدهد؛ بلکه از نقاط آسیب پذیر در برنامه‌ی تحت وب که توسط قربانی مورد بازدید قرار میگیرد، استفاده میکند. در این روش، وب سایت آسیب پذیر، وسیله‌ی انتقال و رساندن اسکریپتِ مخرب به مرورگر قربانی است. با XSS ...
ارتباط بین کامپوننت ها در Vue.js - قسمت چهارم کاربرد Vuex - بخش اول
در قسمت‌های قبلی ( ^ , ^ , ^ ) نحوه‌ی ارتباط بین کامپوننت‌ها بررسی شد؛ روش دیگری هم برای به اشتراک گذاری داده‌ها بین کامپوننت‌ها وجود دارد که با استفاده از کتابخانه‌ای بنام Vuex پیاده سازی میشود. وقتی برنامه‌ی شما وسعت پیدا میکند و ارتباط بین کامپوننت‌ها بیشتر و پیچیده‌تر می‌شود، روشهای قبلی ( ^ , ^ , ^ ) کارایی لازم را ندارند و یا اینکه به سختی میشود داده‌های به اشتراک گذاشته شده‌ی بین کامپوننت‌ها را مدیریت نمود. در اینجا میتوان ا ...
تحلیل و بررسی ده روش آسیب پذیری نرم افزار بر اساس متدولوژی OWASP - قسمت اول SQL Injection
در این سری از مقالات، ده روش برتر آسیب پذیری نرم افزار بر اساس متدولوژی OWASP مورد بررسی قرار میگیرد. یادگیری این روش‌ها منحصر به زبان برنامه نویسی خاصی نیست و رعایت این نکات برای برنامه نویسانی که قصد نوشتن کدی امن دارند، توصیه میشود. کلمه‌ی OWASP مخفف عبارت Open Web Application Security Protocol Project می‌باشد. در واقع OWASP یک متدولوژی و پروژه‌ی متن باز است که معیارهایی را برای ایمن سازی نرم افزار مورد بررسی قرار میدهد. ...
کاربرد Mixins در Vue.js
وقتی از یک زبان برنامه نویسی شیء گرا مثل سی شارپ استفاده میکنیم، تا جای ممکن سعی خواهیم کرد از نوشتن کدهای تکراری خودداری کنیم ( ^ , ^ ) . مثلا یک Super Class داریم که توسط چندین Sub Class مورد استفاده قرار میگیرد و یا از الگوهایی مانند Repository استفاده میکنیم. در Vue.js امکانی فراهم شده تا بتوان کدهایی با قابلیت استفاده‌ی مجدد ایجاد کرد. mixin میتواند شامل تمام قابلیت‌های یک کامپوننت از قبیل بخش‌هایی مثل توابع، دیتا و ... باشد. ...
ارتباط بین کامپوننت‌ها در Vue.js - قسمت سوم استفاده از تزریق وابستگی‌ها
در قسمت‌های قبلی( ^ و ^ ) نحوه‌ی ارتباط بین کامپوننت‌ها در Vue.js بررسی و مزایا و معایب آنها بیان شد. روش دیگری هم برای ارسال اطلاعات از کامپوننتِ Parent به فرزندانش وجود دارد که با استفاده از Dependency Injection یا به اختصار DI مقدور می‌باشد و در ورژن +2.2 معرفی شد که نحوه‌ی ارتباط بین کامپوننتِ Parent و فرزندانش را آسان نمود. پیش‌تر برای ارتباط از Parent به Child، از Props استفاده میکردیم، ولی اگر قرار بود در چند سطح این ارتباط ...
ارتباط بین کامپوننت‌ها در Vue.js - قسمت دوم استفاده از Event Bus
در قسمت قبلی ، نحوه ارتباط بین کامپوننت‌های Parent و Child را مورد بررسی قرار دادیم و اینکه چگونه داده‌هایشان را به اشتراک میگذارند؛ اما چند موضوع در روش قبلی مورد بحث می‌باشد: 1) مدیریت nested componentها برای استفاده از چنین روشی مشکل است. 2) اگر تعداد داده‌های اشتراکی زیاد باشد، مدیریت آنها با استفاده از props گیج کننده می‌باشد. 3) اگر دو کامپوننت مجزا (Sibling Component) قصد به اشتراک گذاری اطلاعاتی را داشتند تکلیف چی ...
ارتباط بین کامپوننت‌ها در Vue.js - قسمت اول ارتباط بین Parent و Child
برنامه‌های Vue.js ای از چندین کامپوننت برای بخش بندی هر قسمت تشکیل میشوند و این بخش بندی برای مدیریت بهتر تغییرات، خطایابی، نگهداری و استفاده مجدد ( reusable) می‌باشد. فرض کنید تعدادی کامپوننت در برنامه داریم و اطلاعات این کامپوننت‌ها بهم وابسته می‌باشند؛ بطور مثال یک کامپوننت انتخاب دسته بندی را داریم و به محض تغییر این مقدار، میخواهیم لیستی از محصولات پیشنهادی یا پرفروشِ آن دسته بندی، در کامپوننت پایین صفحه نمایش داده شود و یا خرید ...
مروری بر قابلیت‌های جدید ES10
از زمان ارائه‌ی نگارش 72 مرورگر chrome، قابلیت‌های استفاده از ES10، میسر شده‌است. برای اینکه از شماره نگارش مرورگر خود مطلع شوید، کافیست به منوی Help و سپس بر روی گزینه‌ی About Google Chrome کلیک کنید تا شماره‌ی نسخه‌ی نصبی بر روی سیستم شما مشخص شود: تابع ()flat : امکان یکی شدن همه آرایه‌های زیرمجموعه (sub-array) مجموعه را در یک آرایه جدید فراهم میکند و با استفاده از depth، سطح ادغام آرایه را مشخص میکنیم (عملکرد این تا ...