آموزش راه‌اندازی پلتفرم IDE ابری code-server در اوبونتو 24.04

کیانا3 هفته پیش

0 16 خواندن این مطلب 8 دقیقه زمان میبرد

مقدمه با حرکت ابزارهای توسعه‌دهنده به سمت فضای ابری، ایجاد و استفاده از پلتفرم‌های IDE (محیط توسعه یکپارچه) ابری در حال رشد است. IDEهای ابری امکان همکاری بی‌درنگ (Real-time) بین تیم‌های توسعه‌دهنده را در یک محیط توسعه یکپارچه فراهم می‌کنند که ناسازگاری‌ها را به حداقل رسانده و بهره‌وری را افزایش می‌دهد. IDEهای ابری از طریق مرورگرهای وب قابل دسترسی هستند و از هر نوع دستگاه مدرنی می‌توان به آن‌ها دسترسی داشت.

code-server نسخه‌ای از Microsoft Visual Studio Code است که روی یک سرور ریموت اجرا می‌شود و مستقیماً از مرورگر شما قابل دسترسی است. Visual Studio Code یک ویرایشگر کد مدرن است که دارای پشتیبانی یکپارچه از Git، دیباگر کد، تکمیل خودکار هوشمند و قابلیت‌های سفارشی‌سازی و توسعه‌پذیری است. این بدان معناست که می‌توانید از دستگاه‌های مختلفی با سیستم‌عامل‌های متفاوت استفاده کنید و همیشه یک محیط توسعه یکپارچه در اختیار داشته باشید.

در این آموزش، شما پلتفرم IDE ابری code-server را روی سرور اوبونتو 24.04 خود راه‌اندازی کرده و آن را روی دامنه خود با گواهینامه‌های رایگان TLS از Let’s Encrypt ایمن‌سازی می‌کنید. در پایان، شما Visual Studio Code را روی سرور خود در حال اجرا خواهید داشت که از طریق دامنه شما در دسترس و با رمز عبور محافظت می‌شود.

پیش‌نیازها

یک سرور با سیستم‌عامل اوبونتو 24.04 با حداقل ۲ گیگابایت رم، دسترسی root و یک حساب کاربری غیر روت با دسترسی sudo. می‌توانید این موارد را با دنبال کردن راهنمای راه‌اندازی اولیه سرور در پارمین کلود (Parmin Cloud) تنظیم کنید.
وب‌سرور Nginx روی سرور شما نصب باشد.
یک نام دامنه کاملاً ثبت‌شده برای میزبانی code-server که به سرور شما اشاره داشته باشد. در این آموزش از code-server.your-domain استفاده می‌شود. می‌توانید دامنه خود را از هر ثبت‌کننده دامنه (Registrar) دریافت کنید. برای اتصال دامنه به سرورهای پارمین کلود، می‌توانید به مستندات DNS پارمین کلود مراجعه کنید.

مرحله ۱ — نصب code-server

در این بخش، شما code-server را روی سرور خود تنظیم می‌کنید. این کار شامل دانلود آخرین نسخه و ایجاد یک سرویس systemd است که باعث می‌شود code-server همیشه در پس‌زمینه اجرا شود. همچنین یک خط‌مشی راه‌اندازی مجدد (Restart Policy) برای سرویس مشخص می‌کنید تا code-server پس از خرابی‌های احتمالی یا ری‌بوت‌ها در دسترس باقی بماند.

تمام داده‌های مربوط به code-server را در پوشه‌ای به نام ~/code-server ذخیره خواهید کرد. با اجرای دستور زیر آن را ایجاد کنید:

bash

mkdir ~/code-server

وارد آن شوید:

bash

cd ~/code-server

باید به صفحه انتشار گیت‌هاب (Releases) code-server مراجعه کرده و آخرین نسخه لینوکس را انتخاب کنید (نام فایل شامل کلمه ‘linux’ خواهد بود). در زمان نگارش این مقاله، آخرین نسخه پایدار 4.23.1 است. آن را با استفاده از wget دانلود کنید:

bash

wget https://github.com/coder/code-server/releases/download/v4.23.1/code-server-4.23.1-linux-amd64.tar.gz

سپس، فایل آرشیو را استخراج کنید:

bash

tar -xzvf code-server-4.23.1-linux-amd64.tar.gz

پوشه‌ای با همان نام فایل دانلودی دریافت خواهید کرد که حاوی کد منبع code-server است. آن را در مسیر /usr/lib/code-server کپی کنید تا بتوانید در سطح سیستم به آن دسترسی داشته باشید:

bash

sudo cp -r code-server-4.23.1-linux-amd64 /usr/lib/code-server

سپس، یک لینک نمادین (Symbolic Link) در مسیر /usr/bin/code-server ایجاد کنید که به فایل اجرایی code-server اشاره داشته باشد:

bash

sudo ln -s /usr/lib/code-server/bin/code-server /usr/bin/code-server

در مرحله بعد، پوشه‌ای برای code-server ایجاد کنید تا داده‌های کاربر را در آن ذخیره کند:

bash

sudo mkdir /var/lib/code-server

اکنون که code-server را دانلود کرده و در سطح سیستم در دسترس قرار دادید، یک سرویس systemd ایجاد می‌کنید تا code-server همیشه در پس‌زمینه در حال اجرا باشد.

پیکربندی سرویس را در فایلی به نام code-server.service در دایرکتوری /lib/systemd/system ذخیره خواهید کرد. آن را با ویرایشگر متن خود ایجاد کنید:

bash

sudo nano /lib/systemd/system/code-server.service

خطوط زیر را اضافه کنید:

/lib/systemd/system/code-server.service

ini

[Unit]

Description=code-server

After=nginx.service

[Service]

Type=simple

Environment=PASSWORD=your_password

ExecStart=/usr/bin/code-server –bind-addr 127.0.0.1:8080 –user-data-dir /var/lib/code-server –auth password

Restart=always

[Install]

WantedBy=multi-user.target

در اینجا ابتدا توضیحات سرویس را مشخص می‌کنید. سپس بیان می‌کنید که سرویس nginx باید قبل از این سرویس راه‌اندازی شود. پس از بخش [Unit]، نوع سرویس را تعریف می‌کنید (simple به این معنی است که پردازش باید به سادگی اجرا شود) و دستوری که اجرا خواهد شد را ارائه می‌دهید.

همچنین مشخص می‌کنید که فایل اجرایی code-server باید با چند آرگومان خاص راه‌اندازی شود. --bind-addr 127.0.0.1:8080 آن را به localhost روی پورت 8080 متصل می‌کند، بنابراین فقط مستقیماً از داخل سرور شما قابل دسترسی است. --user-data-dir /var/lib/code-server دایرکتوری داده‌های کاربر را تنظیم می‌کند و --auth password مشخص می‌کند که بازدیدکنندگان باید با رمز عبور احراز هویت شوند که در متغیر محیطی PASSWORD در خط بالاتر تعریف شده است.

فراموش نکنید که your_password را با رمز عبور دلخواه خود جایگزین کنید، سپس فایل را ذخیره کرده و ببندید.

خط بعدی به systemd دستور می‌دهد تا code-server را در تمام رویدادهای اختلال (مانند کرش شدن یا بسته شدن پردازش) مجدداً راه‌اندازی کند. بخش [Install] به systemd دستور می‌دهد تا این سرویس را زمانی که امکان ورود به سرور شما فراهم می‌شود، راه‌اندازی کند.

سرویس code-server را با اجرای دستور زیر استارت کنید:

bash

sudo systemctl start code-server

بررسی کنید که به درستی راه‌اندازی شده است:

bash

sudo systemctl status code-server

خروجی باید نشان دهد که سرویس active (running) است.

برای اینکه code-server پس از ری‌بوت سرور به‌طور خودکار راه‌اندازی شود، سرویس آن را فعال کنید:

bash

sudo systemctl enable code-server

در این مرحله، شما code-server را دانلود کرده و به صورت سراسری در دسترس قرار دادید. سپس، یک سرویس systemd برای آن ایجاد کرده و فعالش کردید تا code-server در هر بار بوت سرور راه‌اندازی شود. در مرحله بعد، آن را روی دامنه خود در دسترس قرار می‌دهید.

مرحله ۲ — در معرض قرار دادن code-server روی دامنه شما

در این بخش، Nginx را به عنوان یک پروکسی معکوس (Reverse Proxy) برای code-server پیکربندی می‌کنید.

فایل‌های پیکربندی سایت Nginx در مسیر /etc/nginx/sites-available ذخیره می‌شوند و برای فعال شدن باید بعداً به /etc/nginx/sites-enabled لینک شوند.

پیکربندی برای در معرض قرار دادن code-server روی دامنه خود را در فایلی به نام code-server.conf ذخیره کنید:

bash

sudo nano /etc/nginx/sites-available/code-server.conf

خطوط زیر را اضافه کنید:

/etc/nginx/sites-available/code-server.conf

nginx

server {

listen 80;

listen [::]:80;

server_name code-server.your-domain;

location / {

proxy_pass http://localhost:8080/;

proxy_set_header Upgrade $http_upgrade;

proxy_set_header Connection upgrade;

proxy_set_header Accept-Encoding gzip;

}

code-server.your-domain را با دامنه دلخواه خود جایگزین کنید، سپس فایل را ذخیره کرده و ببندید.

در این فایل، تعریف می‌کنید که Nginx باید به پورت HTTP 80 گوش دهد. سپس، یک server_name مشخص می‌کنید که به Nginx می‌گوید برای کدام دامنه درخواست‌ها را بپذیرد. در بلاک بعدی، برای مسیر ریشه (/)، مشخص می‌کنید که درخواست‌ها باید به code-server در حال اجرا روی localhost:8080 ارسال شوند. سه خط بعدی (شروع شده با proxy_set_header) به Nginx دستور می‌دهند تا برخی از هدرهای درخواست HTTP را که برای عملکرد صحیح WebSockets (که code-server به شدت از آن استفاده می‌کند) ضروری هستند، حفظ کند.

برای فعال کردن این پیکربندی، یک لینک نمادین از آن در پوشه /etc/nginx/sites-enabled ایجاد کنید:

bash

sudo ln -s /etc/nginx/sites-available/code-server.conf /etc/nginx/sites-enabled/code-server.conf

برای تست اعتبار پیکربندی، دستور زیر را اجرا کنید:

bash

sudo nginx -t

برای اعمال شدن پیکربندی، باید Nginx را ری‌استارت کنید:

bash

sudo systemctl restart nginx

اکنون نصب code-server شما روی دامنه شما قابل دسترسی است. در مرحله بعد، آن را با گواهینامه TLS رایگان Let’s Encrypt ایمن‌سازی می‌کنید.

مرحله ۳ — ایمن‌سازی دامنه شما

در این بخش، دامنه خود را با استفاده از گواهینامه TLS لی‌تز انکریپت (Let’s Encrypt) ایمن می‌کنید که آن را با استفاده از Certbot تهیه خواهید کرد.

برای نصب آخرین نسخه Certbot و پلاگین Nginx آن، دستور زیر را اجرا کنید:

bash

sudo apt install certbot python3-certbot-nginx

به عنوان بخشی از پیش‌نیازها، شما فایروال UFW را فعال کرده و آن را برای اجازه دادن ترافیک HTTP تنظیم کرده‌اید. برای دسترسی به سایت ایمن، باید آن را برای پذیرش ترافیک رمزنگاری‌شده پیکربندی کنید:

bash

sudo ufw allow https

sudo ufw reload

سپس، در مرورگر خود به دامنه‌ای که برای code-server استفاده کرده‌اید بروید. صفحه ورود به code-server را خواهید دید.

code-server از شما رمز عبور می‌خواهد. رمز عبوری را که در مرحله قبل تنظیم کردید وارد کرده و دکمه Enter IDE را بزنید. اکنون وارد code-server می‌شوید و بلافاصله رابط گرافیکی ویرایشگر آن را خواهید دید.

اکنون که بررسی کردید code-server به درستی روی دامنه شما قرار گرفته است، با استفاده از Certbot گواهینامه‌های TLS را نصب می‌کنید.

برای درخواست گواهینامه برای دامنه خود، دستور زیر را اجرا کنید:

bash

sudo certbot –nginx -d code-server.your-domain

در این دستور، شما certbot را برای درخواست گواهینامه اجرا می‌کنید—نام دامنه را با پارامتر -d پاس می‌دهید. فلگ --nginx به آن می‌گوید که به‌طور خودکار پیکربندی سایت Nginx را برای پشتیبانی از HTTPS تغییر دهد. code-server.your-domain را با نام دامنه خود جایگزین کنید.

اگر این اولین باری است که Certbot را اجرا می‌کنید، از شما خواسته می‌شود یک آدرس ایمیل برای اطلاعیه‌های فوری ارائه دهید و با شرایط خدمات موافقت کنید. سپس Certbot از شما می‌پرسد که آیا می‌خواهید تمام ترافیک HTTP را به HTTPS هدایت کنید:

text

Output

Please choose whether or not to redirect HTTP traffic to HTTPS, removing HTTP access.

– – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – –

1: No redirect – Make no further changes to the webserver configuration.

2: Redirect – Make all requests redirect to secure HTTPS access. Choose this for

new sites, or if you’re confident your site works on HTTPS. You can undo this

change by editing your web server’s configuration.

– – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – –

Select the appropriate number [1-2] then [enter] (press ‘c’ to cancel):

برای به حداکثر رساندن امنیت، گزینه دوم (Redirect) را انتخاب کنید. پس از وارد کردن انتخاب خود، ENTER را فشار دهید. خروجی نشان می‌دهد که Certbot با موفقیت گواهینامه‌های TLS را تولید کرده و آن‌ها را روی پیکربندی Nginx اعمال کرده است.

اکنون می‌توانید دامنه code-server خود را در مرورگر بازخوانی کنید و یک آیکون قفل در سمت چپ آدرس سایت مشاهده کنید که نشان می‌دهد اتصال شما به‌درستی ایمن شده است.

مرحله ۴ — استفاده از رابط کاربری code-server

در این بخش، از برخی ویژگی‌های رابط کاربری code-server استفاده می‌کنید. از آنجایی که code-server همان Visual Studio Code است که در فضای ابری اجرا می‌شود، رابط کاربری آن دقیقاً همانند نسخه دسکتاپ است.

در سمت چپ IDE، یک ردیف عمودی از شش دکمه وجود دارد که پرکاربردترین ویژگی‌ها را در یک پنل جانبی به نام Activity Bar باز می‌کنند.

اولین دکمه منوی کلی را در یک منوی کشویی باز می‌کند، در حالی که نمای دوم پنل Explorer را باز می‌کند که ناوبری درختی ساختار پروژه را فراهم می‌کند. می‌توانید پوشه‌ها و فایل‌های خود را در اینجا مدیریت کنید. نمای بعدی دسترسی به قابلیت جستجو و جایگزینی (Search and Replace) را فراهم می‌کند.

بعد از آن، نمای سیستم‌های کنترل نسخه (مانند Git) قرار دارد. گزینه دیباگر در Activity Bar تمام اقدامات رایج برای دیباگ کردن را در پنل فراهم می‌کند. نمای نهایی منویی برای دسترسی به اکستنشن‌های موجود در مارکت‌پلیس ارائه می‌دهد.

بخش مرکزی رابط کاربری، ویرایشگر شماست که می‌توانید آن را با تب‌ها برای ویرایش کد جدا کنید. می‌توانید نمای ویرایش خود را به سیستم شبکه‌ای (Grid) یا فایل‌های کنار هم تغییر دهید.

با فشردن CTRL+SHIFT+`` یا با کلیک روی Terminalدر منوی کشویی بالایی و انتخابNew Terminal`، می‌توانید به یک ترمینال دسترسی پیدا کنید. ترمینال در یک پنل پایینی باز می‌شود و دایرکتوری کاری آن روی فضای کاری پروژه تنظیم می‌شود.

نتیجه‌گیری

شما اکنون code-server را، یک IDE ابری همه‌کاره، روی سرور اوبونتو 24.04 خود نصب کرده‌اید، آن را روی دامنه خود قرار داده و با استفاده از گواهینامه‌های Let’s Encrypt ایمن‌سازی کرده‌اید. اکنون می‌توانید روی پروژه‌ها به صورت انفرادی و همچنین در یک محیط همکاری تیمی کار کنید. اجرای یک IDE ابری، منابع ماشین محلی شما را آزاد می‌کند و در صورت نیاز امکان مقیاس‌پذیری منابع را فراهم می‌سازد.

از همراهی شما با پارمین کلود سپاسگزاریم.

کیانا3 هفته پیش

0 16 خواندن این مطلب 8 دقیقه زمان میبرد