شروع مسیر توسعه وب موردی هست که در این مقاله قصد داریم آن را بررسی کنیم. مهارت های خاصی در حال افزایش تقاضا هستند، مهارتهایی که تقریباً می تواند شغل و فرصتهای شما را برای سالها و دهه های آینده تضمین کند، یکی از این مهارت ها توسعه وب است.
آیا فکر کرده اید که چگونه یک توسعه دهنده وب شوید؟ یا شروع مسیر توسعه وب را از کجا آغاز کنید؟
بر خلاف تصور رایج، شما برای شروع مسیر توسعه وب یا تبدیل شدن به یک توسعه دهنده وب و ایجاد یک وب سایت کاربردی، نیازی به مدرک لیسانس مهندسی کامپیوتر ندارید.
در واقع، اگر از دستورالعمل های این مقاله پیروی کنید، می توانید خیلی سریعتر از آنچه فکر می کنید به یک توسعه دهنده وب تبدیل شوید (اما این کار هنوز هم سختی های خودشو داره!).
آماده؟ بیایید با اصول اولیه شروع کنیم:
توسعه دهنده وب چیست یا کیست؟
در اینجا پاسخ ساده ای برای این سوال وجود داره: آنها وب سایت هایی را ایجاد و نگهداری می کنند.
به عبارت دیگر آنها به معنای واقعی کلمه، تجربه فعلی شما در وب را ایجاد کرده اند.
وب سایت هایی که قصد دارند کاربران از تجربه کردن خودشان در آن لذت ببرند به توسعه دهندگان وب عالی نیاز دارند.
و صاحبان وبسایت معمولاً مایل به پرداخت پول نقدی جدی ای برای به خدمت گرفتن این توسعه دهندگان عالی وب هستند.
مسئولیت های یک توسعه دهنده وب:
. صفحات وب را با ترکیبی از زبانهای نشانه گذاری (markup languages) می نویسند.
. ماکت ها و نمونه های اولیه با کیفیت ایجاد می کنند.
. توانایی ایجاد یک سایت وردپرسی را از ابتدا دارند.
. HTML و CMS را درک می کنند.
. تجربه کاربری (UX)، طراحی کاربری (UI) و کاربرد پذیری (learning usability) را می فهمند.
. خدمات و تعمیرات وب سایت را ارائه می دهند.
. توانایی ایجاد وب سایت های کاربردی و جذاب و اپلیکیشن های تحت وب را دارند.
اینها رایج ترین الزامات هستند، اما مسئولیت ها و وظایف شما بسته به برنامه توسعه وب و همچنین نوع تخصص توسعه وب متفاوت خواهد بود.
منظور صحبت از تخصص های توسعه وب، سه مورد است که باید از آنها آگاه باشید:
توسعه Frontend:
منظور از “frontend” “چیزهای” موجود در وب سایتی است که می بینید و با آنها تعامل دارید، به عنوان مثال. منوها، اسلایدر ها و غیره
توسعه Backend :
“backend” مانند بخشی از کوه یخ در زیر سطح است، بدون آن وب سایت نمی تواند کار کند، backend با سرورها، برنامه ها، پایگاه داده و … سرو کار دارد.
توسعه Full-stack:
این ترکیبی از توسعه backend و frontend است.
چرا شما باید یک توسعه دهنده وب شوید؟
توسعه وب صنعتی است که به این زودی از بین نخواهد رفت.
در حقیقت، اداره آمار کار ایالات متحده رشد ۱۳ درصدی مشاغل موجود در زمینه توسعه وب را تا سال ۲۰۲۸ پیش بینی کرده است.
به زبان ساده، اگر توانایی توسعه این مهارت را دارید، برای آینده قابل پیش بینی کار پیدا کردن سخت نخواهد بود.
در اینجا پنج مزیت بزرگ برای توسعه دهنده وب بودن وجود دارد:
۱.می توانید از راه دور کار کنید:
تا به حال فکر کرده اید که کار کردن از هرجای دنیابه وقت خودت چگونه خواهد بود؟
به عنوان یک توسعه دهنده وب، فرصتهای زیادی برای کار کردن از راه دور خواهید داشت
شاید بتوانید سرانجام همزمان با پس انداز پول، رویای سفر به دور دنیا را برآورده کنید.
۲.شما می توانید از مهارت های خود برای ساختن وب سایت ها و وب اپلیکیشن خود استفاده کنید:
آیا می خواهید یک وب سایت یا برنامه سودآور ایجاد کنید؟
با استفاده از مهارتتان، برای ساختن آن مجبور نیستید یک تن پول بپردازید، خودتان می توانید با کسری از قیمت آن را بسازید.
۳.می توانید به طور مستقل کار کنید:
اگر نمی خواهید، مجبور نیستید دیگر زیر چتر رئیس کار کنید! وقتی که نقطه شروع مسیر توسعه وب را می دانید خیلی راحت تر می توانید کار خود را به صورت آزاد شروع کنید.
۴.وارد صنعت سودآور فناوری شوید:
در واقع شروع مسیر توسعه وب بلیط شما برای صنعت فناوری است!
بیشتر استارت آپ های فناوری به برخی از توسعه دهندگان وب نیاز دارند
بنابراین این می تواند راه شما برای وارد شدن شما به ای عرصه باشد.
۵.شما می توانید چیزهای عالی بسازید:
قسمت جالب این است که شما می توانید به هر اندازه که می خواهید خلاق باشید! به جای اینکه به وب سایت ها نگاه کنید و فکر کنید:
“وای ، عالی به نظر می رسد، ای کاش می توانستم چنین چیزی را ایجاد کنم” اکنون شما خودتان قادر خواهید بود که وب سایت بسیار جذاب خود را ایجاد کنید.
شما چی فکر میکنید؟ آیا همه اینها شما را درباره ایده تبدیل شدن به یک توسعه دهنده وب هیجان زده می کند؟
در این صورت، شما در جای مناسب قرار دارید، زیرا می خواهید مراحلی را که برای تبدیل شدن به آن نیاز دارید را یاد بگیرید!
چگونه می توان یک توسعه دهنده وب شد
۱. اصول HTML ، CSS و Javascript را بیاموزید
اینها پیچ و مهره های برنامه نویسی وب سایت است که اگر تصمیم به برنامه نویسی و ساختن وب سایت برای تأمین هزینه زندگی خود دارید، روزانه با آنها سر و کار خواهید داشت.
- HTML ساختار را دیکته می کند
- CSS آن را زیبا نشان می دهد
- Javascript باعث عملکرد آن می شود
بیایید درباره هر یک از اینها و چگونگی یادگیری آنها بحث کنیم.
HTML:
HTML مخفف “Hypertext Markup Language” است، این یکی از اصلی ترین مواد تشکیل دهنده هر وب سایت و یکی از زبانها در اصطلاح frontend است.
به طور خلاصه، عمدتا از طریق یک سری تگ اسکلت اساسی یک وب سایت را فراهم می کند، یک تگ همان کد HTML است که ظاهر محتوای سند HTML را کنترل می کند.
در اینجا چند برچسب متداول HTML وجود دارد که باید با آنها آشنا شوید:
- <HTML>… </HTML>:
این تگ در ابتدا و انتهای یک سند HTML نشان داده می شود، این نشان می دهد که سند با HTML5 نوشته شده است.
- <title>… </title>:
تگ title عنوان صفحه است که با ذکر صریح موضوع اصلی هر صفحه:
هم برای موتورهای جستجو (وقتی صفحات را اسکن و فهرست می کنند) و هم برای کاربران مفید است (در نوار عنوان مرورگر نشان داده می شود)
- <head>… </head>:
این شامل اطلاعات مخصوص مربوط به هر صفحه، از جمله تگ های عنوان، فراداده ها و محل لینک به اسکریپت ها و برگه های استایل است.
- <body>… </body>:
این شامل کلیه مطالب یا محتوایی است که به کاربران نشان داده خواهد شد، از جمله همه مواردی که آنها مشاهده می‌کنند و می‌خوانند.
توجه: همه برچسب ها مانند “<body>” شروع می شوند و مانند “</body>” ختم می شوند.
“/” نشان می دهد که پس از آن برچسب خاص دیگر استفاده نمی شود، مهم است که برچسب پایان را وارد کنید، در غیر این صورت کل سند از آن برچسب استفاده می کند.
CSS:
CSS مخفف “Cascading Style Sheets” است، این زبان استایل را در ساختار HTML قرار می دهد، اساساً بدون CSS نتیجه کل صفحه وب و سند HTML ما خسته کننده به نظر می‌رسد.
CSS را می توان به ۳ روش به اسناد HTML اضافه کرد:
- Inline: با استفاده از مشخصه (attribute)
styleدر داخل عناصر HTML - Internal: با استفاده از عنصر
<style>در بخش<head> - External: با استفاده از عنصر
<link>برای پیوند دادن به یک پرونده CSS خارجی
متداول ترین روش برای افزودن CSS و نگهداری استایل ها در فایل های CSS خارجی (external) است.
Javascript:
جاوا اسکریپت محبوب ترین زبان برنامه نویسی جهان است که به راحتی قابل یادگیری است.
که به شما امکان می دهد عناصری را در صفحات وب پیاده سازی کنید تا از ویژگی هایی مانند: نقشه های تعاملی، گرافیک ۲D/3D و غیره بهره ببرید.
یک تابع JavaScript بلوکی از کد JavaScript است که می تواند در صورت “فراخوانی” اجرا شود.
به عنوان مثال، هنگامی که یک رویداد رخ می دهد (مثل حرکت موس روی عناصر صفحه مانند منو ها)
می توان یک عملکرد را فراخوانی کرد (مثل باز شدن منو هنگام قرار گرفتن موس بر روی آن)
۲. اصول وردپرس را بیاموزید
برای تبدیل شدن به یک توسعه دهنده وب، باید با وردپرس آشنا شوید.
از این گذشته، ۶۳٪ از کل وب سایت ها توسط این نرم افزار منبع باز رایگان تأمین می شوند که می توانید اساساً برای هر میزبان وب (web host) نصب کنید.
ما تعداد زیادی راهنمای وردپرس در این وب سایت داریم، لینک های زیر را امتحان کنید:
پس از راه اندازی سایت وردپرس، برای مشتریان خود آسان است که محتوا اضافه کنند (حتی اگر تجربه توسعه وب ندارند).
۳. UI و UX را بشناسید
UI (رابط کاربری) و UX (تجربه کاربری) از اصول طراحی تجربه کاربری هستند.
بیشتر توسعه دهندگان متخصص طراحی نیستند، این دو قلمرو (یعنی اصول طراحی تجربه کاربری با تخصص طراحی ) متفاوت هستند، شما نیازی به یک متخصص حرفه ای طراحی نخواهید داشت.
توجه به این نکته مهم است که با یادگیری اصول طراحی تجربه کاربری، می توانید نحوه کار یک وب سایت را بهتر درک کنید، این باعث می‌شود:
- کاربران بیشتری در سایت بمانند
- به آنها کمک کند آنچه را که به دنبال آن هستند پیدا کنند
- و در نهایت هزینه بیشتری را در آن سایت صرف کنند.
برای یادگیری عناصر سازنده مهارت های طراحی، توصیه می کنیم Adobe Creative Suite را یاد بگیرید
فتوشاپ باید اولین چیزی باشد که آن را درک می کنید، زیرا این مورد برای اکثر طراحان جدی است، اگر Adobe را دوست ندارید، می توانید به Sketch نیز بروید که یک ستاره در حال طلوع در بین طراحان است.
در اینجا چند منبع برای درک و یادگیری UI و UX آورده شده است:
۴. SQL و PHP را بیاموزید
ما این دو را با در کنار هم تعریف خواهیم کرد زیرا مثل دو روی یک سکه هستند.
SQL:
SQL یک فناوری پایگاه داده است که اطلاعات را ذخیره می کند (برای کسب اطلاعات بیش تر به این صفحه مراجعه کنید).
PHP:
PHP یک زبان “اسکریپت نویسی” است که مواردی را در یک پایگاه داده قرار می دهد یا از آن بیرون می کشد
(برای کسب اطلاعات بیش تر به این صفحه مراجعه کنید).
به عنوان مثال در مورد وردپرس فکر کنید.
این از MySQL برای ذخیره و مدیریت اطلاعات (پست های وبلاگ، محتوای صفحه، نظرات، اطلاعات کاربر و غیره) در “جدول” پایگاه داده استفاده می کند.
PHP همان چیزی است که باعث پویایی یک وب سایت وردپرسی می‌شود
با تمامیه این عناصر مختلف و گوناگون تعامل برقرار کرده و پایگاه داده را به درستی به روز می کند.
یادگیری بیشتر در مورد چگونگی کار با هم SQL و PHP می تواند به شما در تسلط بر توسعه سایت وردپرس کمک کند، که به معنای واقعی کلمه صدها (اگر نه هزاران نفر) هر روز بدنبال شغل و تابلو های پروژه یاب در سرتاسر اینترنت هستند.
کار آسانی نیست، شما طی یک یا دو هفته به همه اینها مسلط نخواهید شد اما با گذشت زمان، آشنا شدن و سپس کارکردن خوب در این مجموعه مهارت ها به این معنی است که شما همیشه یک حرفه سودآور پیش رو خواهید داشت.
۵- اصول SEO را بیاموزید
SEO مخفف Search Engine Optimization است، این به روند بهبود رتبه بندی یک وب سایت در یک موتور جستجو مانند Google اشاره دارد، این یکی از مهمترین مهارتها در تجارت آنلاین است.
برای کسب اطلاعات بیش تر مورد استراتژی طراحی صفحات وب به این دو مقاله مراجعه کنید:
- بهترین استراتژی طراحی وب سایت چیست؟
- بهترین طراحی استراتژیک وب برای موفقیت در بازاریابی دیجیتالی چیست؟
ممکن است فکر کنید، “اگر من یک توسعه دهنده هستم، چرا باید نگران رتبه بندی یک سایت در موتورهای جستجو باشم؟ آیا این وظیفه وبلاگ نویسان و سازندگان محتوا نیست؟ “
خوب بله، بخش بزرگی از SEO وب سایت با محتوا مرتبط است، اما ساختار و کد های وب سایت هم نیز نقش دارند.
به عنوان مثال، تگ های عنوان (HTML) برای سئو بسیار مهم هستند، آنها به موتورهای جستجو می گویند چه چیزی در وب سایت واقعاً مهم است.
حال، آیا شما نیاز به یک متخصص سئو دارید؟ قطعا نه. اما شما باید اصول SEO را بیاموزید، و SEO را در هنگام ایجاد هر وب سایت در ذهن داشته باشید.
با این کار، شانس موفقیت بیشتر به وب سایت خواهید داد و مشتریان توسعه وب خود را بسیار شادتر خواهید کرد.
در اینجا چند نکته SEO در مورد توسعه دهندگان وب آورده شده است:
۱.متا تگ (meta tags) های خود را بهینه کنید:
در صفحه جستجو ، متا تگ به مرورگرها می گوید که سایت شما در چه زمینه ای است و هرچه بهتر باشد، احتمال کلیک کردن روی سایت شما بیشتر است.
۲.اطمینان حاصل کنید که برچسب های عنوان شما به ترتیب خاصی قرار دارند:
H1 باید عنوان اصلی باشد، و سپس شما باید از طریق عناوین سطح پایین تر از طریق صفحه (به عنوان مثال ، H2 ، H3 ، H4 و غیره) پایین بروید.
این امر باعث می شود موتورهای جستجو بتوانند سایت را آسان تر پیمایش کنند.
۳.اطمینان حاصل کنید که برچسب عنوان شما به درستی صفحه وب را توصیف می کند:
عنوان باید تأکید کند که صفحه درباره چیست.
در اینجا چند منبع برای یادگیری اصول SEO وجود دارد:
حداقل ۳ تا ۵ ساعت را به خواندن از طریق منابع و یادگیری اصول اختصاص دهید، این امر شما را برای توسعه وب سایت هایی با در نظر گرفتن سئو آماده می کند.
۶. اطمینان حاصل کنید که سایت شما واکنش گرا است
هنگامی که وب سایت خود را ایجاد می کنید (اگر بخواهید مشتری بیشتری جذب کنید ایده خوبی خواهد شد) باید مطمئن شوید که سایت شما واکنش گرا است.
واکنش گرا یعنی تنظیم عناصر وب سایت با توجه به اندازه صفحه، این بدان معناست که:
وب سایت شما چه در بازدیدکننده از لپ تاپ باشد و چه از طریق دستگاه تلفن همراه، ظاهر خوبی خواهد داشت.
در سال ۲۰۲۱ ، طراحی ریسپانسیو (Responsive) بسیار مهم است
همه مشتریان شما این انتظار را دارند با مثال پیش بروید و مطمئن شوید وب سایت شما واکنش گرا است.
بسیار خوب، پس از گذراندن این ۶ مرحله درک اولیه ای از شروع مسیر توسعه وب خواهید داشت، از این به بعد شما می دانید که چگونه این کار را انجام دهید (حداقل در سطح ابتدایی).
در این مراحل وقت بگذارید، به این زودی ها تقاضا برای توسعه دهندگان وب کاهش نمی یابد، بنابراین وقت دارید که یاد بگیرید.
نتیجه
بازار کار سخت تر می شود، تعداد مشاغل سنتی که هر روز از رده خارج می شوند بیش تر می شود. بنابراین، چرا مهارتی را یاد نمی گیرید که شما را در آینده ای نزدیک قابل اشتغال (و احتمالاً ثروتمند) نگه دارد؟
این مزیت بزرگ شروع مسیر توسعه وب است، قسمت مهم این است که:
شما برای ورود به این رشته نیازی به یک مدرک گران قیمت فانتزی ندارید، به سادگی با دنبال کردن مراحلی که در اینجا ذکر کردیم، می توانید مسیر تبدیل شدن به یک توسعه دهنده وب را شروع کنید.
همچنین، بسیاری از گزینه های نرم افزار Integra Development Environment (IDE) وجود دارد که زندگی یک توسعه دهنده را بسیار آسان می کند.
برای خلاصه کردن، در اینجا مراحل اساسی برای تبدیل شدن به یک توسعه دهنده وب وجود دارد:
- اصول HTML ، CSS و Javascript را بیاموزید
- آموزشهای وردپرس را مرور کنید
- اصول UI و UX را بیاموزید
- SQL و PHP را بیاموزید
- اصول SEO را بیاموزید
- اطمینان حاصل کنید که سایت شما واکنش گرا است
اکنون وقت آن است که اقدامی انجام دهیم و به جهانیان نشان دهیم که شما می توانید یک توسعه دهنده وب عالی باشید!
اگر در این راه سوالی داشتید، لطفاً در زیر نظر دهید و ما را در جریان بگذارید.
۳۰ دیدگاه. ارسال دیدگاه جدید
استاد یه سوال می‌پرسم راستشو بگو
خداییش الان نون تو فرانت اند هست یا بک اند ؟
دوست داشتم نظر شما رو به عنوان یک بک اند کار بدونم
سلام و درود امیدوارم حالتان خوب باشد، ممکن است بارها این سوال را از خودمون پرسیده باشیم درآمد در برنامه نویسی در کجا بیش تر است، بزار یک دید تازه بهت بدم اول در خصوص تقسیم بک اند و فرانت اند:
در واقع این دو دنیا کنار هم معنا پیدا می‌کنند شما فکر کن دیجیکالا با این تجربه کاربری که داره در بخش فرانت،ممکن باشه بخش امنیتش که مربوط به بک اند باشه مشکل داشته باشه و کاربر بتونه بدون پرداخت، کالا بخره یا برعکس تیم بک اند عالی کار کرده باشه ولی بخاطر نبود تجربه کاربری خوب در رقابت شکست بخوره.
شما به عنوان یک برنامه نویس بک اند دغدغه اتون تشکیل یه تیم برنامه نویسی قدرت مند باشه که پروژه رو کامل بگیری و با نفرات فرانتت تقسیم کنی هم درآمد بهتری داره و هم ممکنه کنارشون یاد بگیری و درآینده به یک فول استک تبدیل شی.
و در مورد کسب ایده درباره خود درآمد در برنامه نویسی به مقاله “چگونه اولین مشتری توسعه وب خود را پیدا کنیم یا یک فریلنسر شویم؟” مراجعه کنید
بورس خوبه ؟
سلام میرسونه!
عالی بود . خیلی کامل همه چیزو توضیح دادید.
سلام و درود خیلی خوشحالم که با انسان پر انرژی مانند شما روبه رو شدم امیدوارم همیشه خوش و خرم پر انرژی باشید
خیلی عالی 👌👌👌
عزیز دلی برادر
سلام استاد … میشه لطفا در زمینه php و mvc و لاراول چندتا منبع خوب و معتبر معرفی کنید ؟
سلام و درود در آینده ما قصد داریم آموزش و مقالاتی در این خصوص منتشر کنیم و می‌توانید با ما همراه باشید و به دلیل جنبه تبلیغاتی برای کسب اطلاعات بیشتر می‌توانید با ایدی @mahdi_foladsharr در تلگرام تماس برقرار کنید
سلام … برای فرانت اند شدن چقدر زمان نیاز هست ؟
سلام برا فرانت اند شدن یک روز برای متخصص شدن همه عمرت، جواب این سوال را باید خودتون بدین که کی و از کجا میخواهید شروع کنید و دوم تا چه موقع قصد دارید به کسب مهارت های لازم ادامه دهید، در مهندسی کامپیوتر همیشه یک چیز جدید برا یادگرفتن هست، به طور معمول بین دو تا شش سال طول میکشه که شما در این زمینه به درآمد برسید.
خسته نباشید واقعا استادگرامی
پر بار باشید هنر جوی گرامی
عالی و مناسب همه سطوح♡
از وقتی که گذاشتید کمال تشکر را دارم.
استاد با توجه به سایر مقاله هایی که در سایتتون خوندم فهمیدم باید برای خودم یه مسیر راه انتخاب کنم و هر بار چک کنم که کجای مسیر هستم . درسته ؟ میشه برای تبدیل شدن به یه فول استک به من مسیر راه بدید ؟
برای کسب ایده بهتر به مقاله “چگونه مسیر یادگیری برنامه نویسی وب را به روش صحیح بیاموزیم؟” مراجعه کنید.
مطالبتون عالی بود
ممنون لطف دارید
استاد برای شروع برنامه نویسی به چقدر سرمایه نیاز دارم ؟
برا شروع برنامه نویسی این چند تا چیز لازمه، ممکنه حالا برا تهیه اونا پولی که خرج میکنی متغییر باشه، ببین کدوم هارو داری یا باید تهیه کنی ۱٫لبتاب مناسب برنامه نویسی ۲٫ آموزش پروژه محور که ممکنه از چند صد تومان شروع شه تا چند میلیون تومان ۳٫ هاست مناسب برای زمان انتشار اولین پروژه ات، ما بقی چیزا که تو ایران کرک شده اس پیدا میکنی پول نمیخواد بدی مثل ویرایشگر سورس و تحریم شکن.
برای استخدام در شرکت ها شما کدام زبان را پیشنهاد می کنید ؟
برای کسب ایده بهتر به مقاله “PHP یا ASP.NET” مراجعه کنید.
ببخشید نظرتون راجب به nod js چی هست ؟
دوست عزیز بنده مطالعه زیادی در این زمینه نداشته‌ام. سوالتان را از همکار بنده در قسمت نظرات مقاله زبان برنامه نویسی کاتلین بپرسید
سلام استاد وقت بخیر.
من میخوام بک اند کار بشم. برای یه برنامه نویس بک اند چقدر نیازه که فرانت رو بلد باشه؟
سلام، شما کلا برا اینکه یک توسعه دهنده شوید باید یک مسیر تخصصی طی کنید.
شما فقط کافیه بتوانید یک وبسایت امروزی طراحی کنید، اصلا لازم نیست مفاهیم تئوری دنبال کنید. بعد ها با دیدن امکانات بروز شما به خودتون هعی تاکید میکنید بیش تر یاد بگیرید
از این رو هیچ کسی نمیتونه بهتون بگه چقدر یادبگیر بلکه بستگی به انگیزه وسخت کوشی خود شما داره.برای درک این این مسیر تخصصی یک مقاله جدید داریم آماده میکنیم که امروز و فردا منتشر میشه.
سلام امکانش هست راهنمایی بفرمایید
من می خوام زبان جاوا اسکریپتو شروع کنم
فقط مشکلی که دارم اینه که کارت گرافیک ندارم و سیستمم
cpu…corei59600k گرافیک مجتمع داره
رمش۱۶
میشه برنامه نویسی رو شروع کرد؟
تو رو خدا پاسخ بدید.
سلام سیستم خوبی داری از سرعتش استفاده کن.
در آینده گرافیک ارتقاء بده
بهتره هارد ssd هم داشته باشه.
ولی در مجموع خوبه سیستمت.