با حركت ابزارهاي گسترش دهنده به سمت cloud ، ايجاد و تطابق پذيري پلتفرم cloud IDE (محيط پيشرفت ادغام شده) در حال رشد است. Cloud IDE ها امكان همكاري زمان واقعي (real-time) بين تيم هاي توسعه دهنده را فراهم مي كنند تا در يك محيط توسعه يكپارچه كار كنند و ناسازگاري ها را به حداقل مي رساند اما توليد را افزايش ميدهد. چون از طريق مرورگرهاي وب قابل دسترسي اند ، Cloud IDE ها در هر نوع دستگاه مدرن موجود هستند.
code-server يك كد مايكروسافت ويژوال استوديو است كه روي يك سرور مجازي از راه دور اجرا مي شود و مستقيماً از مرورگر شما قابل دسترسي است. ويژوال استوديو كد يك ويرايشگر كد مدرن با پشتيباني Git ادغام شده، يك اشكال زدا براي كد، داراي تكميل خودكار هوشمند و ويژگي هاي قابل سفارشي سازي و قابل بسط ميباشد. بدان معني كه مي توانيد از دستگاه هاي مختلف با سيستم عامل هاي مختلف استفاده كنيد و هميشه يك محيط توسعه مداوم داشته باشيد.
در اين آموزش ، پلتفرم cloud IDE كد سرور مجازي را بر روي دستگاه Debian 10 خود تنظيم كرده و آن را در دامنه قرار مي دهيد ، كه با گواهي TLS در Let’s Encrypt ايمن شده است. در آخر، كد ويژوال استوديو را روي سرور مجازي Debian 10 خود راه اندازي ميكنيد كه در دامنه شما در دسترس است و با پسورد محافظت ميشود.
پيش نيازها
⦁ سرور مجازي كه Debian 10 را اجرا ميكند با حداقل 2 گيگابايت رم ، دسترسي به ريشه و يك حساب sudo و غير ريشه. مي توانيد اين كار را با دنبال كردن راهنماي اوليه تنظيم سرور انجام دهيد.
⦁ Nginx كه روي سرور مجازي شما نصب شده باشد. براي راهنمايي در مورد نحوه انجام اين كار ، مراحل 1 تا 4 نحوه نصب Nginx را در Debian 10 مطالعه كنيد.
⦁ يك نام دامنه كاملا ثبت شده براي ميزباني كد سرور مجازي ، كه به سرور مجازي شما اشاره ميكند. در اين آموزش از code-server.your-domain استفاده مي شود. مي توانيد نام دامنه را در Namecheap خريداري كنيد ، به صورت رايگان در Freenom دريافت كنيد ، يا از ثبت دامنه مورد نظر خود استفاده كنيد.
مرحله 1 – نصب كد- سرور مجازي
در اين بخش كد-سرور مجازي را روي سرور مجازي خود تنظيم مي كنيد. اين مستلزم دانلود آخرين نسخه و ايجاد سرويس سيستمي است كه كد-سرور مجازي را هميشه در پس زمينه اجرا مي كند. همچنين رويكرد ريستارت را براي سرويس تعيين خواهيد كرد ، به اين ترتيب كد-سرور مجازي پس از خرابي يا ريبوت احتمالي در دسترس خواهد بود.
همه داده هاي مربوط به كد-سرور مجازي را در پوشه اي به نام ~ / code-server ذخيره مي كنيد. با اجراي دستور زير آن را ايجاد كنيد:
⦁ $ mkdir ~/code-server
به آن پوشه برويد:
⦁ $ cd ~/code-server
⦁
بايد به صفحه نسخه هاي كد-سرور مجازي Github برويد و آخرين لينوكس را انتخاب كنيد (نام فايل شامل “linux” خواهد بود). در زمان نوشتن ، آخرين نسخه 3.2.0 بوده است. با اجراي دستور زير آن را با استفاده از wget دانلود كنيد:
$ wget https://github.com/cdr/code-server/releases/download/3.2.0/code-server-3.2.0-linux-x86_64.tar.gz

سپس با اجراي اين دستور، آرشيو را باز كنيد:
⦁ $ tar -xzvf code-server-3.2.0-linux-x86_64.tar.gz
⦁
پوشه اي دقيقاً به نام فايل اصلي كه دانلود كرده ايد ، دريافت ميكنيد كه شامل كد منبع كد-سرور مجازي است. آن را در / usr / lib / code-server كپي كنيد تا با اجراي دستور زير بتوانيد به صورت گسترده به آن دسترسي پيدا كنيد:
⦁ $ sudo cp -r code-server-3.2.0-linux-x86_64 /usr/lib/code-server
⦁
سپس ، يك لينك نمادين را در / usr / bin / code-server ايجاد كنيد ، كه به قابليت اجراي كد-سرور مجازي اشاره كند:
⦁ $ sudo ln -s /usr/lib/code-server/code-server /usr/bin/code-server
⦁
در مرحله بعد ، يك پوشه براي كد-سرور مجازي ايجاد كنيد ، كه در آن داده هاي كاربر را ذخيره مي كند:
⦁ $ sudo mkdir /var/lib/code-server
⦁
اكنون كه كد-سرور مجازي را دانلود كرده ايد و آن را در سراسر سيستم در دسترس قرار داده ايد ، يك سرويس سيستمي ايجاد خواهيد كرد تا كد-سرور مجازي را هميشه در پس زمينه اجرا كنيد.
پيكربندي سرويس را در فايلي به نام code-server.service ، در ديركتوريuser / lib / systemd / system ذخيره خواهيد كرد ، جايي كه سيستم عامل سرويس هاي خود را ذخيره مي كند. آن را با استفاده از ويرايشگر متن خود ايجاد كنيد:
⦁ $ sudo nano /lib/systemd/system/code-server.service
⦁
خطوط زير را اضافه كنيد:

/lib/systemd/system/code-server.service
[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 بدان معني است كه فرايند بايد به سادگي اجرا شود) و فرماني را كه اجرا مي شود ارائه مي دهد.
همچنين مشخص مي كنيد كه اجراي كد-سرور مجازي جهاني بايد با چند آرگومان خاص براي كد-سرور مجازي آغاز شود. –bind-addr 127.0.0.1:8080 آن را به localhost  در پورت 8080 متصل مي كند ، بنابراين فقط از داخل سرور مجازي شما قابل دسترسي است. –user-data-dir /var/lib/code-server دايركتوري داده هاي كاربر خود را تنظيم مي كند ، و –auth password مشخص مي كند كه بايد بازديد كنندگان را با يك رمزعبور ، مشخص شده در متغير محيط PASSWORD كه در خط بالاي آن مشخص شده است ، تأييد كند.
به ياد داشته باشيد كه your_password را با رمز عبور دلخواه خود جايگزين كنيد ، سپس فايل را ذخيره كنيد و ببنديد.
خط بعدي به systemd مي گويد تا كد-سرور مجازي را در تمام مواقع عدم كاركرد ريستارت كند (براي مثال ، هنگام خرابي يا قطع فرايند). بخش [Install] به سيستم دستور مي دهد تا در صورت امكان ورود به سرور مجازي شما ، اين سرويس را شروع كند.
با اجراي دستور زير سرويس كد-سرور مجازي را شروع كنيد:
⦁ $ sudo systemctl start code-server
⦁
با مشاهده وضعيت آن بررسي كنيد كه درست شروع شده است:
⦁ $ sudo systemctl status code-server
⦁
خروجي مشابه اين مشاهده خواهيد كرد:
Output
● code-server.service – code-server
Loaded: loaded (/lib/systemd/system/code-server.service; disabled; vendor preset: enabled)
Active: active (running) since Wed 2020-05-13 19:31:00 UTC; 13s ago
Main PID: 1851 (node)
Tasks: 14 (limit: 2378)
Memory: 25.7M
CGroup: /system.slice/code-server.service
├─1851 /usr/lib/code-server/node /usr/lib/code-server/out/node/entry.js –bind-addr 127.0.0.1:8080 –user-data-dir /var/lib/code-server –auth pas
└─1862 /usr/lib/code-server/node /usr/lib/code-server/out/node/entry.js –bind-addr 127.0.0.1:8080 –user-data-dir /var/lib/code-server –auth pas

May 13 19:31:00 code-server-update systemd[1]: Started code-server.
May 13 19:31:01 code-server-update code-server[1851]: info code-server 3.2.0 fd36a99a4c78669970ebc4eb05768293b657716f
May 13 19:31:01 code-server-update code-server[1851]: info HTTP server listening on http://127.0.0.1:8080
May 13 19:31:01 code-server-update code-server[1851]: info – Using custom password for authentication
May 13 19:31:01 code-server-update code-server[1851]: info – Not serving HTTPS
May 13 19:31:01 code-server-update code-server[1851]: info Automatic updates are enabled

براي شروع خودكار كد-سرور مجازي پس از راه اندازي مجدد سرور ، سرويس خود را با اجراي دستور زير فعال كنيد:
⦁ $ sudo systemctl enable code-server
⦁
در اين مرحله ، كد-سرور مجازي را دانلود كرده و آن را در سطح جهاني در دسترس قرار داده ايد. سپس ، يك سرويس سيستمي براي آن ايجاد كرده ايد و آن را فعال كرده ايد ، بنابراين كد-سرور مجازي از هر بوت سرور مجازي شروع مي شود. سپس ، با پيكربندي Nginx به عنوان يك پروكسي معكوس بين بازديد كننده و كد-سرور مجازي آن را در معرض نمايش دامنه خود قرار مي دهيد.
مرحله 2 – قرار دادن كد-سرور مجازي در معرض دامنه
در اين بخش ، Nginx را به عنوان يك پروكسي معكوس براي كد-سرور مجازي پيكربندي مي كنيد.
همانطور كه در مرحله پيش نياز Nginx آموخته ايد ، فايل هاي پيكربندي سايت آن تحت /etc/nginx/sites-available ذخيره مي شوند و بعداً بايد با /etc/nginx/sites-enabled لينك شوند تا فعال گردند.
پيكربندي را براي قرار دادن كد-سرور مجازي در دامنه خود در فايلي به نام code-server.conf ، تحت /etc/nginx/sites-available ذخيره مي كنيد. با ايجاد ويرايشگر خود را شروع به كار كنيد:
⦁ $ sudo nano /etc/nginx/sites-available/code-server.conf
⦁
خطوط زير را اضافه كنيد:
/etc/nginx/sites-available/code-server.conf
server {
listen 80;
listen [::]:80;

server_name code-server.your-domain;

location / {
غير مجاز مي باشد_pass http://localhost:8080/;
غير مجاز مي باشد_set_header Upgrade $http_upgrade;
غير مجاز مي باشد_set_header Connection upgrade;
غير مجاز مي باشد_set_header Accept-Encoding gzip;
}
}

code-server.your-domain را با دامنه مورد نظر خود جايگزين كنيد ، سپس فايل را ذخيره كنيد و ببنديد.
در اين فايل ، تعريف مي كنيد كه Nginx بايد به پورت HTTP 80 گوش كند. سپس ، يك server_name را تعيين مي كنيد كه به Nginx مي گويد براي كدام دامنه درخواست ها را بپذيرد و اين پيكربندي خاص را اعمال كند. در بلوك بعدي ، براي مكان ريشه (/) ، مشخص مي كنيد كه درخواست ها بايد به كد-سرور مجازي در حال اجرا در localhost:8080 به جلو و عقب منتقل شوند. سه خط بعدي (كه با غير مجاز مي باشد_set_header شروع ميشود) به Nginx دستور مي دهد تا برخي از هدرهاي درخواست HTTP را كه براي عملكرد صحيح WebSockets مورد نياز هستند ، استفاده كند.
براي فعال كردن پيكربندي اين سايت، بايد سيملينكي از آن را با دستور زير در پوشه /etc/nginx/sites-enabled ايجاد كنيد:
$ sudo ln -s /etc/nginx/sites-available/code-server.conf /etc/nginx/sites-enabled/code-server.conf

براي آزمايش اعتبار پيكربندي ، دستور زير را اجرا كنيد:
⦁ $ sudo nginx -t
⦁
خروجي زير را مشاهده خواهيد كرد:
Output
nginx: the configuration file /etc/nginx/nginx.conf syntax is ok
nginx: configuration file /etc/nginx/nginx.conf test is successful

براي اينكه پيكربندي عملي شود ، بايد Nginx را مجدداً راه اندازي كنيد:
⦁ $ sudo systemctl restart nginx
⦁
اكنون نصب سرور مجازي كد شما در دامنه شما قابل دسترسي است. در مرحله بعد ، با استفاده از يك گواهي نامه Let’s Encrypt TLS رايگان ، آن را ايمن خواهيد كرد.

مرحله 3 – امنيت بخشيدن به دامنه
در اين بخش دامنه خود را با استفاده از گواهي نامه Let’s Encrypt TLS كه با استفاده از Certbot تهيه مي نماييد، ايمن مي كنيد.
براي نصب آخرين نسخه Certbot ، دستور زير را اجرا كنيد:
⦁ $ sudo apt install certbot python-certbot-nginx
⦁
به عنوان بخشي از پيش نيازها، ufw (فايروال كامپايل نشده) را فعال و آن را براي ارائه ترافيك HTTP رمزگذاري نشده پيكربندي كرديد. براي امكان دسترسي به سايت ايمن، بايد آن را به گونه اي پيكربندي كنيد كه ترافيك رمزگذاري شده را با اجراي دستور زير بپذيرد:
⦁ $ sudo ufw allow https
⦁
خروجي به صورت زير خواهد بود:
Output
Rule added
Rule added (v6)
به صورت مشابه با Nginx، بايد آن را براي اعمال پيكربندي مجدد لود كنيد:
$ sudo ufw reload
خروجي به اين صورت خواهد بود:
Output
Firewall reloaded

سپس در مرورگر خود به دامنه مورد استفاده براي سرور مجازي كد برويد. اعلان ورود به سرور مجازي كد را مشاهده خواهيد كرد.

سرور مجازي كد از شما مي خواهد رمز عبور خود را وارد كنيد. رمز عبوري كه در مرحله قبل تنظيم كرديد وارد كنيد و Enter IDE را بزنيد. اكنون سرور مجازي كد را وارد كرده و فوراً رابط كاربري گرافيكي آن را مشاهده مي كنيد.

اكنون كه بررسي كرد كد سرور مجازي به درستي در اختيار دامنه قرار گرفته است، گواهي هاي Let’s Encrypt TLS را براي ايمني با استفاده از Certbot نصب ميكنيد.
$ sudo certbot –nginx -d code-server.your-domain

در اين دستور ، شما certbot را براي درخواست گواهينامه ها براي دامنه خود اجرا مي كنيد – نام دامنه را با پارامتر -d وارد ميكنيد. پرچم –nginx به آن مي گويد براي پشتيباني از HTTPS ، پيكربندي سايت Nginx را به طور خودكار تغيير دهيد. به ياد داشته باشيد كه دامنه code-server.your خود را با نام دامنه خود جايگزين كنيد.
اگر اولين بار است كه Certbot را اجرا مي كنيد ، از شما خواسته مي شود كه يك آدرس ايميل براي اخطارهاي ضروري وارد كنيد و شرايط خدمات EFF را بپذيريد. سپس Certbot درخواست Let’s Encrypt براي گواهي دامنه شما را ميدهد. سپس از شما سؤال مي كند كه آيا مايليد همه ترافيك HTTP را به HTTPS هدايت كنيد:
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):

توصيه مي شود براي به حداكثر رساندن امنيت گزينه دوم را انتخاب كنيد. پس از وارد كردن انتخاب خود ، ENTER را فشار دهيد.
خروجي مشابه اين خواهد بود:
Output
IMPORTANT NOTES:
– Congratulations! Your certificate and chain have been saved at:
/etc/letsencrypt/live/code-server.your-domain/fullchain.pem
Your key file has been saved at:
/etc/letsencrypt/live/code-server.your-domain/privkey.pem
Your cert will expire on … To obtain a new or tweaked
version of this certificate in the future, simply run certbot again
with the “certonly” option. To non-interactively renew *all* of
your certificates, run “certbot renew”
– Your account credentials have been saved in your Certbot
configuration directory at /etc/letsencrypt. You should make a
secure backup of this folder now. This configuration directory will
also contain certificates and private keys obtained by Certbot so
making regular backups of this folder is ideal.
– If you like Certbot, please consider supporting our work by:

Donating to ISRG / Let’s Encrypt: https://letsencrypt.org/donate
Donating to EFF: https://eff.org/donate-le

اين بدان معني است كه Certbot موفق به توليد گواهينامه هاي TLS شده و آنها را در پيكربندي Nginx براي دامنه شما به كار مي برد. اكنون مي توانيد دامنه كد سرور مجازي خود را در مرورگر خود مجدد لود كنيد و يك پدلاك (قفل) در سمت چپ آدرس سايت مشاهده كنيد ، اين بدان معني است كه اتصال شما به درستي ايمن است.
اكنون كه كد-سرور مجازي را از طريق يك پروكسي معكوس Nginx در دامنه خود داريد ، آماده استفاده از واسط كاربري كد-سرور مجازي هستيد.
مرحله 4 – استفاده از رابط كد-سرور مجازي
در اين بخش از برخي از ويژگي هاي رابط كد-سرور مجازي استفاده خواهيد كرد. از آنجا كه كد-سرور مجازي ويژوال استوديو كد در حال اجرا در cloud است ، همان رابط كاربري نسخه دسكتاپ مستقل را دارد.
در سمت چپ IDE ، يك رديف عمودي از شش دكمه وجود دارد كه بيشترين ويژگي هاي مورد استفاده را در يك صفحه جانبي كه با عنوان Activity Bar شناخته مي شود باز مي كند.

اين نوار قابل تنظيم است بنابراين مي توانيد اين نماها را به ترتيب ديگري جابجا كنيد يا آنها را از نوار حذف كنيد. به طور پيش فرض ، اولين دكمه منوي كلي را به صورت كشويي باز مي كند ، در حالي كه نماي دوم پنل اكسپلورر را باز مي كند كه پيمايش درخت مانند از ساختار پروژه را فراهم مي كند. مي توانيد پوشه ها و فايل هاي خود را در اينجا مديريت كنيد – ايجاد ، حذف ، جابجايي و تغيير نام آنها در صورت لزوم. نماي بعدي دسترسي به عملكرد جستجو و جايگزيني را فراهم مي كند
به دنبال اين ، به ترتيب پيش فرض ، نماي شما از سيستم هاي كنترل منبع مانند Git قرار ميگيرد. كد ويژوال استوديو همچنين از ساير ارائه دهندگان كنترل منبع پشتيباني مي كند و مي توانيد در اين مستندات دستورالعمل هاي بيشتري را براي جريان كاري كنترل منبع با ويرايشگر بيابيد.

گزينه اشكال زدايي در نوار فعاليت ، كليه اقدامات معمول را براي اشكال زدايي در پنل ارائه مي دهد. ويژوال استوديو كد با پشتيباني داخلي براي اشكال زدايي زمان اجراي Node.js و هر زباني كه به Javascript تبديل شود همراه است. براي ساير زبانها مي توانيد افزونه هايي را براي اشكال زدايي مورد نياز نصب كنيد. مي توانيد پيكربندي هاي اشكال زدايي را در فايل launch.jsonذخيره كنيد.

نماي نهايي در نوار فعاليت ، منويي را براي دسترسي به افزونه هاي موجود در Marketplace فراهم مي كند.
قسمت اصلي GUI ويرايشگر شماست كه مي توانيد آن ها را با استفاده از زبانه ها براي ويرايش كد خود جدا كنيد. مي توانيد نماي ويرايش خود را به يك سيستم شبكه يا به فايل هاي جانبي تغيير دهيد.

پس از ايجاد فايل جديد از طريق منوي File ، يك فايل خالي در يك تب جديد باز مي شود و پس از ذخيره سازي ، نام فايل در پنل جانبي Explorer قابل مشاهده خواهد بود. ايجاد پوشه ها را مي توان با كليك راست بر روي نوار كناري Explorer و كليك بر روي New Folder انجام داد. مي توانيد پوشه اي را با كليك بر روي نام آن و همچنين drag و drop فايل ها و پوشه ها به قسمتهاي بالايي بسط دهيد تا آنها را به يك مكان جديد منتقل كنيد.

مي توانيد با وارد كردن CTRL + SHIFT + `، يا با كليك كردن بر روي ترمينال در منوي كشويي بالاي منو ، و انتخاب New Terminal ، به ترمينال دسترسي پيدا كنيد. ترمينال در يك پنل پايين تر باز خواهد شد و ديركتوري كار آن روي فضاي كاري پروژه تنظيم مي شود ، كه شامل فايل ها و پوشه هاي نمايش داده شده در پنل سمت Explorer است.
شما يك نماي كلي سطح بالا از رابط كد سرور مجازي را جستجو كرده ايد و برخي از متداول ترين ويژگي ها را مشاهده كرده ايد.
نتيجه
اكنون كد-سرور مجازي ، يك IDE همه كاره cloud را در اختيار داريد كه بر روي سرور مجازي Debian 10 شما نصب شده است ، در دامنه شما قرار گرفته و با استفاده از گواهي Let’s Encrypt ايمن شده است. هم اكنون مي توانيد بر روي پروژه ها بصورت جداگانه و همچنين در يك مجموعه همكاري تيمي كار كنيد. اجراي IDE cloud منابع موجود در دستگاه محلي شما را آزاد مي كند و به شما امكان مي دهد منابع را در صورت لزوم مقياس كنيد. براي اطلاعات بيشتر در مورد ويژگي هاي ديگر و دستورالعمل هاي دقيق در مورد ساير مؤلفه هاي كد-سرور مجازي ، به مطالب كد ويژوال استوديو مراجعه كنيد.