Thursday, May 7, 2020

VS Code


C++ , Python , html etc in Ubuntu by VS Code
 
( Visual Studio Code )


Linux, Windows, macOS എന്നീ ഓപ്പറേറ്റിംഗ് സിസ്‍റ്റങ്ങളിൽ ഉപയോഗിക്കാവുന്ന ഒരു ഓപ്പൺ സോഴ്‌സ് കോഡ് എഡിറ്ററാണ് VS Code അഥവാ Visual Studio Code. കോഡ് പൂർത്തീകരണം, സിന്റാക്സ് ഹൈലൈറ്റിംഗ്, ഇന്റഗ്രേറ്റഡ് ടെർമിനൽ തുടങ്ങിയവ ഇതിലെ ഏതാനും സവിശേഷതകളാണ്. സോഴ്‌സ് കോഡ് സൗജന്യവും ഓപ്പൺ സോഴ്‌സുമാ VS Code എഡിറ്റർ MIT ലൈസൻസിന് കീഴിലാണ് പുറത്തിറ ക്കുന്നത്.




1. VS Code
 

Synaptic Package Manager / Ubuntu Software / Terminal വഴിയോ, ഡൗണലോഡ് ചെയ്‍തോ VS Code സോഫ്‍റ്റ്‍വെയർ ഇൻസ്‍റ്റാൾ ചെയ്യാവുന്നതാണ്. ഡൗൺലോഡ് ചെയ്യുന്നതിന് താഴെ കൊടുത്തിരി ക്കുന്ന ലിങ്ക് ഉപയോഗിക്കുക.
https://code.visualstudio.com/download


2. Python
നാം ഉപയോഗിച്ചുകൊണ്ടിരിക്കുന്ന കമ്പ്യൂട്ടറുകളിൽ (IT@School Gnu/Linux 18.04) Python സോഫ്‍റ്റ്‍വെയർ ഉണ്ടാകും അപ്പോൾ വീണ്ടും ഇൻസ്‍റ്റാൾ ചെയ്യേണ്ടതില്ല. ഇല്ലെങ്കിൽ സോഫ്‍റ്റ്‍വെയർ ഡൗൺലോഡ് ചെയ്‍ത് ഇൻസ്‍റ്റാൾ ചെയ്യു


3. C++ ( CPP )

C++ programiing language ൽ തയ്യാറാക്കുന്ന പ്രോഗ്രാമുകൾ കംപൈൽ ചെയ്യുന്നതാനായി GCC ( GNU Compiler Collection) നമ്മുടെ കമ്പ്യൂട്ടറിൽ ഉണ്ടായിരിക്കേണ്ടതാണ്. ലിനക്സ് അധിഷ്ടിത കമ്പ്യൂട്ടറുകളിൽ
g++ compiler ആണ് നാം ഇൻസ്‍റ്റാൾ ചെയ്യേണ്ടത്. നാം ഉപയോഗിക്കുന്ന കമ്പ്യൂട്ടറുകളിൽ ഈ സോഫ്‍റ്റ്‍വെയറുണ്ടോ എന്നറിയുന്നതിനായി താഴെ കൊടുത്തിരിക്കുന്ന കമാന്റ് ഉപയോഗിക്കുക.
gcc—version
കമാന്റ് റൺ ചെയ്യുമ്പോൾ g++ compiler ഇൻസ്‍റ്റാൾഡ് ആണെങ്കിൽ അതിന്റെ വേർഷനേതാണെന്നും മനസ്സിലാക്കാൻസാധിക്കും.
g++ compiler ഇൻസ്‍റ്റാൾഡ് അല്ലെങ്കിൽ താഴെ കൊടുത്തിരിക്കുന്ന കമാന്റുകളുപയോഗിച്ച് ഇൻസ്‍റ്റാൾ ചെയ്യുക.
sudo apt-get update
sudo apt-get install build-essential gdb
sudo apt install g++
[ വിവിധ പ്രോഗ്രാമിംഗ് ഭാഷകളെ പിന്തുണയ്ക്കുന്ന ഗ്നു പ്രോജക്റ്റ് നിർമ്മിക്കുന്ന ഒരു കംപൈലർ സിസ്റ്റമാണ് GNU Compiler Collection (GCC). ഗ്നു ടൂൾ ചെയിനിന്റെ ഒരു പ്രധാന ഘടകമാണ് ജിസിസി. ലിനക്സ് കേർണൽ ഉൾപ്പെടെ ഗ്നു, ലിനക്സ് എന്നിവയുമായി ബന്ധപ്പെട്ട മിക്ക പ്രോജക്റ്റുകളുടെയും സ്റ്റാൻഡേർഡ് കംപൈലറാണ് GCC. Free software Foundation , GNU General Public License (GNU GPL) നു കീഴിൽ GCC വിതരണം ചെയ്യുന്നു. സ്വതന്ത്ര സോഫ്റ്റ്‌വെയറിന്റെ വളർച്ചയിൽ GCC ഒരു പ്രധാന പങ്ക് വഹിച്ചിട്ടുണ്ട്. ]

ഏതാനും ലളിതമായ പ്രോഗ്രാമുകൾ ( Python & C++ ) VS Code എഡിറ്ററിലൂടെ തയ്യാറാക്കുന്നത് എങ്ങ നെയെന്ന് നോക്കാം. VS Code എഡിറ്ററിലൂടെ പ്രോഗ്രാമുകൾ തയ്യാറാക്കുമ്പോൾ ഏതാനും എക്സ്റ്റൻഷനുകൾ കൂടി ഇൻസ്‍റ്റാൾ ചെയ്യേണ്ടതായിട്ടുണ്ട്. ഇവ പ്രോഗ്രാം തയ്യാറാക്കുന്ന സമയത്ത് ഇൻസ്‍റ്റാൾ ചെയ്താലും മതി.

VS Code സോഫ്‍റ്റ്‍വെയർ ഇൻസ്‍റ്റാൾ ചെയ്‍തു കഴ്ഞ്ഞാൽ Applications --> Programming ( Accessories) --> Visual Studio Code എന്ന ക്രമത്തിൽ സോഫ്‍റ്റ്‍വെയർ തുറക്കാം



രണ്ട് സംഖ്യകളുടെ തുക കാണുന്നതിനുള്ള വളരെ ലളിതമായ ഒരു പ്രേഗ്രാം തയ്യാറാക്കാം




നമ്മൾ തയ്യാറാക്കുന്ന പ്രോഗ്രാം സേവ് ചെയ്‍ത് സൂക്ഷിക്കാനുള്ള ഒരു ഫോൾഡർ അനുയോജ്യമായ ലൊക്കേഷനിൽ നിർമ്മിച്ചു വെയ്ക്കുക. അതിനുശേഷം VS Code Editor തുറക്കുക. തുറന്നുവന്നിരിക്കുന്ന വിൻഡോയിലെ ഇടതു വശത്തുള്ള Activity bar ൽ നിന്നും Explore ടാബിൽ ക്ലിക്കു ചെയ്യുക.



Side bar ലുള്ള Open Folder ടാബിൽ ക്ലിക്കുചെയ്ത് അനുയോജ്യമായ ഫോൾഡർ സെലക‍്ട് ചെയ്‍ത് OK ക്ലിക്കുചെയ്യുക.



Side bar ൽ നാം സെലക‍്ട് ചെയ്‍ത ഫോൾഡർ കാണാം





Side bar ലുള്ള നാം സെലക‍്ട് ചെയ്ത ഫോൾഡറിന്റെ പേരിനു നേരെയുള്ള New File ഓപ്‍ഷനിൽ ക്ലിക്ക് ചെയ്യുമ്പോൾ വരുന്ന ബോക്സിൽ ഫയലിന് അനുയജ്യമായ പേര് (sum.py) നൽകി Enter key പ്രസ്സ് ചെയ്യുക.






Editor ജാലകം പ്രവർത്തനസജ്ജമായിരിക്കുന്നതായി കാണാം. കൂടാതെ Editor ജാലകത്തിന്റെ താഴെ വലതു വശത്തായി Python extenesion ഇൻസ്‍റ്റാൾ ചെയ്യാൻ നിർദ്ദേശിക്കുന്ന ഒര മെസ്സേജും കാണാം. ഇത് നാം ഇൻസ്‍റ്റാൾ ചെയ്യേണ്ടതാണ്. Install ബട്ടണിൽ ക്ലിക്കുചെയ്യുക. Install ബട്ടണിൽ ക്ലിക്കുചെയ്യുന്നതോടെ Activiyy bar ലെ Extensions ഓപ്‍ഷനിലേക്ക് വരികയും ഇൻസ്‍റ്റലേഷൻ ആരംഭിക്കുകയും ചെയ്യും.





ഇൻസ്‍റ്റലേഷൻ പൂർത്തിയാകുന്നതോടെ രണ്ടാമതൊരു extenesion ഇൻസ്‍റ്റാൾ ചെയ്യാനുള്ള നിർദ്ദേശം വരും. Editor ജാലകത്തിൽ നമ്മുടെ പ്രോഗ്രാമിനു വേണ്ട കോഡുകൾ ടൈപ്പ് ചെയ്യുക.




 
Editor ജാലകത്തിന്റെ മുകളിൽ വാണുന്ന വെളുത്ത ഡോട്ട് സേവ് ചെയ്യാനുള്ളതാണ്.

സേവ് ചെയ്യുക. സേവ് ചെയ്തു കഴിയുമ്പോൾ ഫയൽ Editor ജാലകത്തിൽ നിന്നും അപ്രത്യക്ഷമാകാം. വീണ്ടും Editor ജാലകത്തിൽ ഉൾപ്പെടുത്തുന്നതിനായി Side bar ലുള്ള ഫയലിന്റെ പേരിൽ ക്ലിക്കു ചെയ്താൽ മതി.



അടുത്തതായി നമുക്ക് ഫയൽ റൺ ചെയ്യണം. അതിനായി Editor ജാലകത്തിന്റെ വലതു വശത്തു കാണുന്ന play ബട്ടണിൽ ക്ലിക്കു ചെയ്യുക. അപ്പോൾ Editor ജാലകത്തിന്റെ താഴെയുള്ള Panel ൽ പ്രോഗ്രാം പ്രവർത്തിക്കുന്നതായി കാണാം.
 

 

സോഫ്‍റ്റ്‍വെയർ ക്ലോസ്സ് ചെയ്യാം.

അടുത്തതായി നമുക്ക് ഇതേ പ്രോഗ്രാം C++ ഉപയോഗിച്ച് എങ്ങനെ ചെയ്യാമെന്നു നോക്കാം.



VS Code Editor തുറക്കുക. ഇപ്പോൾ നേരത്തെ തയ്യാറാക്കിയ Python പ്രോഗ്രാം തന്നെയായിരിക്കും തുറന്നുവന്നിട്ടുണ്ടാകുക. ഇതോ ഫോൾഡറിൽത്തന്നെയാണ് പുതിയ പ്രോഗ്രാമും തയ്യാറാക്കാനുദ്ദേശി ക്കുന്നതെങ്കിൽ Editor ജാലകത്തിൽ നിന്നും ഫയൽ ക്ലോസ്സ് ചെയ്യുക. തുടർന്ന് Side bar ഫോൾഡറിന്റെ പേരിനു നേരെയുള്ള New File ഓപ്‍ഷനിൽ ക്ലിക്ക് ചെയ്യുമ്പോൾ വരുന്ന ബോക്സിൽ ഫയലിന് അനുയജ്യമായ പേര് (sum.cpp) നൽകി Enter key പ്രസ്സ് ചെയ്യുക.



[ Python പ്രോഗ്രാം ഫയലുകളുടെ എക‍്സ്‍റ്റൻഷൻ .py എന്നും, C++ പ്രോഗ്രാം ഫയലുകളുടെ എക‍്സ്‍റ്റൻഷൻ .cpp എന്നുമാണ് നൽകേണ്ടത്.] ‍‍





Editor ജാലകം പ്രവർത്തനസജ്ജമായിരിക്കുന്നതായി കാണാം. കൂടാതെ Editor ജാലകത്തിന്റെ താഴെ വലതു വശത്തായി Python extenesion ഇൻസ്‍റ്റാൾ ചെയ്യാൻ നിർദ്ദേശിക്കുന്ന ഒര മെസ്സേജും കാണാം. ഇത് നാം ഇൻസ്‍റ്റാൾ ചെയ്യേണ്ടതാണ്. Install ബട്ടണിൽ ക്ലിക്കുചെയ്യുക. I



Install ബട്ടണിൽ ക്ലിക്കുചെയ്യുന്നതോടെ Activiyy bar ലെ Extensions ഓപ്‍ഷനിലേക്ക് വരികയും ഇൻസ്‍റ്റലേഷൻ ആരംഭിക്കുകയും ചെയ്യും.






നമുക്ക് മറ്റൊരു extension കൂടി ഇൻസ്‍റ്റാൾ ചെയ്യേണ്ടതായിട്ടുണ്ട്




Extensions ടാബിലെ searchബോക്സിൽ Code Runner എന്ന് ടൈപ്പ് ചെയ്ത് Enter key പ്രസ്സ് ചെയ്യുക




Install ബട്ടൺ ക്ലിക്കുചെയ്ത് ഈ എക‍്സ്റ്റൻഷനും ഇൻസ്റ്റാൾ ചെയ്യുക.



Editor ജാലകത്തിൽ നമ്മുടെ പ്രോഗ്രാമിനു വേണ്ട കോഡുകൾ ടൈപ്പ് ചെയ്യുക.




നേരത്തെ സൂചിപ്പിച്ച രീതിയിൽ ഫയൽ സേവ് ചെയ്യുകയും പ്രവർത്തിപ്പിച്ചു നോക്കുകയും ചെയ്യുക.


* * * * * *



[ Visual Studio Code Editor ഇല്ലാതെയും നമ്മൾ സാധാരണ ഉപയോഗിക്കാറുള്ള Text Editor Python,

C++ പ്രോഗ്രാമുകൾ തയ്യാറാക്കി Terminal തുറന്ന് അനുയോജ്യമായ കമാന്റുകൾ നൽകിയും പ്രവർത്തിപ്പിക്കാം. Text Editor ഉപയോഗിക്കുമ്പോൾ പ്രോഗ്രാമിലെ മുഴുവൻ ടെക‍്സ്‍റ്റുകളും ചിഹ്നങ്ങളുമെല്ലാം നമ്മൾ ടെപ്പ് ചെയ്യണം. എന്നാൽ Visual Studio Code Editor പോലുള്ള എഡിറ്ററുകൾ ഉപയോഗിക്കുമ്പോൾ മുഴുവൻ നമ്മൾ ടൈപ്പ് ചെയ്യേണടതില്ല. അതുപോലെ പ്രോഗ്രാം റൺ ചെയ്യുന്നതിനായി നമ്മൾ പുറമേ നിന്നുള്ള ടെർമിനലുകളും ഉപയോഗിക്കേണ്ടതില്ല. കോഡ് എഡിറ്ററിൽത്തന്നെ terminal window യും play ബട്ടണുമുണ്ട്.. ]





Python പ്രോഗ്രാമുകൾ ടെർമിനൽ വഴി പ്രവർത്തിപ്പിക്കന്നതിന് , ഫയൽ സേവ് ചെയ്തു വെച്ചിരിക്കുന്ന ഫോൾഡർ തുറക്കുക. ഫോൾഡറിനുള്ളിൽ Right click ചെയ്‍ത് Open in Terminal സെലക‍്ട് ചെയ്യുക. തുടർന്ന് ടെർമിനലിൽ python filename.py നൽകി Enter key പ്രസ്സ് ചെയ്താൽ മതി.

C++ പ്രോഗ്രാമുകൾ ടെർമിനൽ വഴി പ്രവർത്തിപ്പിക്കിന്നതിന്, ഫയൽ സേവ് ചെയ്തു വെച്ചിരിക്കുന്ന ഫോൾഡർ തുറക്കുക. ഫോൾഡറിനുള്ളിൽ Right click ചെയ്‍ത് Open inTerminal സെലക‍്ട് ചെയ്യുക. തുടർന്ന് ടെർമിനലിൽ g++ filename.cpp നൽകി Enter key പ്രസ്സ് ചെയ്യുക. അപ്പോൾ ഫോൾഡറിൽ a.out എന്ന പേരിൽ ഒരു ഫയൽ പ്രത്യക്ഷപ്പെടും. തുടർന്ന് ടെർമിനലിൽ ./a.out എന്ന് ടൈപ്പ് ചെയ്ത് Enter key പ്രസ്സ് ചെയ്യുക.

Visual Studio Code എഡിറ്ററിൽ html, css, javascript തുടങ്ങിയവ ഉൾപ്പെടുന്ന ഫയലുകളും വളരെ എളുപ്പത്തിൽ തയ്യാറാക്കാൻ സാധിക്കും. VS Code എഡിറ്റർ തുറന്ന് html ഫയൽ തയ്യാറാക്കി നോക്കൂ....