ไม่สามารถเล่นวิดีโอนี้
ขออภัยในความไม่สะดวก
VS Code on my Phone for Website Dev... (How I did it)
ฝัง
- เผยแพร่เมื่อ 1 ธ.ค. 2020
- VS Code on my Phone for Website Dev... (How I did it)
I setup VS Code on my mobile phone and started developing websites. This is entirely possible to do from any location, on any devices such as an iPhone, iPad, Android or tables.
Using vscode on any devices requires it to be accessible on the browser. To do this, we use a package called code-server. This allows us to access our physical machine remotely via the web, which VS Code will be running on. Since VS Code works on Electron, it's not normally accessible on platforms outside of a desktop.
However, this solution allows you to perform web dev through the browser. This setup can also be done through workspaces, or even through your own cloud server via Amazon or Google Cloud platform.
If you're a web developer, you should definitely give this a go. Be aware that security is a must for this implementation, as it does mean that your system is accessible remotely, so use SSL, have passwords, etc.
Code Server can be found here on github:
github.com/cdr...
#vscode #website #development
Learn Design for Developers!
A book I've created to help you improve the look of your apps and websites.
📘 Enhance UI: www.enhanceui....
Feel free to follow me on:
🐦 Twitter: in...
💬 Discord: / discord
💸 Patreon: / adriantwarog
Software & Discounts:
🚾 Webflow: webflow.grsm.i...
🌿 Envato: 1.envato.marke...
🌿 Envato Elements: 1.envato.marke...
🔴 Elementor: elementor.com/...
✖ Editor X: www.editorx.co...
Computer Gear:
⬛ Monitor: amzn.to/3f9DOQI
⌨ Keyboard: amzn.to/3eA5UFD
🐁 Mouse: amzn.to/3xVJO8l
🎤 Mic: amzn.to/3hgCfms
📱 Tablet: amzn.to/3ewt7sa
💡 Lighting: amzn.to/3vOZeZY
💡 Key Lighting: amzn.to/3f6qP2f
Camera Equipment:
📷 Camera: amzn.to/3uCv4J9
📸 Primary Lens: amzn.to/3vT6wMm
📸 Secondary Lens: amzn.to/3tyqWIX
🎥 Secondary Camera: amzn.to/3o2zCGi
🎙 Camera Mic: amzn.to/33tCz9l
🎞 USB to HDMI: amzn.to/33yW9RE
![CAMPปลิ้น | EP.79[2/2] มานั่งฮ้านกินข้าวนำกันเด้ออ้ายยย](http://i.ytimg.com/vi/pHIS_Sdy8P8/mqdefault.jpg)
The video I always wanted to make but I was too lazy to set the whole thing up lol.
Good job! Now code out a whole website on your phone and film it
Based on the amount of time this took, and the number of camera angles required, sure, no worries, I’ll do this in my sleep!
Edwin c'mon man I was trying to install vs code on my new phone u should make a video my gorgeous friend😂
Adrian this did really work for me thanks alot, I have a potato laptop
Nice to meet you " PewDiePie of Computers" , literally I am having a great respect for you sir , by the way I am from India 🙏 , I will be purchasing your courses whenever I have collected some money😂 thanks for your GOLD content
@Dev Ed Hello My Gorgeous Teacher On The Internet.
❤ FROM 🇮🇳
Isn't anybody going to talk about his body language and facial expression while explaining? I mean that's unique.
Haha thanks man!
I’m getting nervous watching it 🙈
Dont quite remeber but he has played either his video on low FPS or Higher FPS in post production!
@@mirzaaghaalikhan183 neither, but I did use to play a lot of FPS if that counts!
@@AdrianTwarog I am quite happy I got attention of a programmer at index 0. And by FPS, if you mean videogames, then I am your fan already.. Cheers ¦--}
Edit: my assumption was based on this, you may want to check this out!
th-cam.com/video/G025oxyWv0E/w-d-xo.html
Wait what! VS Code on phone? I think it is about Codespaces. That's so different! Thanks a lot for the video Adrian!
Always testing the water for new tech
Wow! This is so simple. A great option for it could be a cheaper Mac Mini, setup as a home server.
Or a free cloud server!
Two things:
Amazing video, great tips
I love your little dances when you talk as well. Very exciting for keeping my focus
I just need a tiny keyboard to Bluetooth to my phone, then easy web dev on the go 🤘🤘
Perfect
and VR headset and boom you have vscode projector on the go.
@@thatcurioustrader2166 stay tuned for the next video :)
@@AdrianTwarog holy shit
Wow my mind is open
Fantastic info, fantastic video. Love the multiple camera angles.
Thanks, I put a heap of effort into it!
Thanks for doing the thing I always wanted to do but never wanted to do :D lol
This is what I’m here for :)
"maybe also Linux"😂 Dude, it's electron
What meaneth you?.... I am i new a stupid person to this realm of coding gibberish
@@user-un2qi4eo9n Electron is like a simplified web browser that uses websites to create applications like Discord, MS Teams, VSCode. It supports almost every desktop platform 😀
I'm on Linux and I use vs code
@@FalseDev me too :)
slurp i ever install VS Code on Ubuntu
I've tried codespaces and it is the future... Also, a phone can be a desktop - using a Samsung phone and DEX I just needed peripherals (monitor, mouse and keyboard) to have a desktop experience running VS code from my phone.
Yes but I think the idea is to not be tied to a desk
I love how you said maybe also Linux. Don’t worry you got it right. It is on Linux.
Oh god I wasn’t stressing, I wasn’t, I wasn’t. I was?
Linux is god🙇🏻♂️
@@AdrianTwarog I don't think so :-)
im using ubuntu x vscode
Great video but it kinda sucks companies don't release IDE's like VSCode for Android Tablets like Samsung Tab S7+ or iPadOS tablets. Modern tablets are very powerful and can fully replace a PC or Mac, the only issue is the software.
I agree for android, since android is more open than iOS/iPadOS. I think the only issues is big IDE maker don't see the Android tablet community for programming is big enough to bother. The Ipad has more potential to make big IDE maker interested but the iPadOS limitation is the issue.
@@sirAvdul you can run vscode on android with a local linux virtual machine but it's not the best
how can you guide me
VS code is an open source project, and electron aps can be compiled to run on Android, in conclusion it should be possible to compile VS code to an android app. If it works and is useble is an other question
yeah brad already did this before 1-2 years ago : really good piece of technology
It’s super, their alpha beta system makes it even easier now
With some tech, I don’t bother watching a possibly outdated video from 1-2 years ago.
Thank you Adrian!
Lots of love @AdrianTwarog wonderful tutorial ❤
@@AdrianTwaroghow not clear
Wow ! I never knew about this ! Thanks for info. :D
Was gonna ask Ben Awad to create vs code for ipad. Now i dont need to. :D
Awesome idea though, feel free to send more like those my way any day!
Just to be clear, vscode (and the editor behind vscode called Monaco) doesn’t support touch screen well. You can move the cursor by touch the screen, but you can’t select characters.
Yeah but Splashtop does. (Just to be clear)
This is cool and I'm toying with the idea of making a website on my phone. Only problem I have is that the backspace key doesn't work on my phone. Works fine when using my PC though.
I was looking for this
Thank you!!
Haha great!
For people who got confused, he edited the part where it showed his own public IP to 255.255.255.255 (it's not a valid Public IPv4) don't try. ^^
Now you can do site mobile adaptive design without pain
But with magnifying glass hehe
Instead of binding the to the IP given in ifconfig you can just bind it to 0.0.0.0 that way you won’t need to change it when dhcp changes your ip... also it will work with all your network interfaces..
Another awesome video Adrian!
Thanks!
Here I am fighting with hackintosh and what not all the time but the idea just clicked that I can just run codeserver on a VM under proxmox. So now I have a plan B if my hackintosh blows up when upgrading to Big Sur. Still is a bummer about the extensions, it's the one thing that has kept me at the testing stage of codeserver. At the start of your video it looked like you were launching and app for codeserver?
This is awesome ^^ I really appreciate you sharing this with us🙏🏽
My pleasure 😊
Unpopular opinion: Restricting where you can write code and where you can write code actually makes you a better developer.
Why?
Not the case. Whenever you impose restrictions upon the tools you use you simultaneously restrict the scale of what you can create
Excellent video!! Thank you... Now I can't get away from vscode ever 😂
Exactly!
I was just wondering this last night! If I saw this video 24 hours earlier I wouldn’t have spent $10 on an iOS remote code editor 😦
Great tutorial.. which font are you using on this? I am not able to use the font that I typically use like CasCadiaCode with Powerline Gylphs which give me custom symbols. Any idea how to do that?
Wow. Cool. The best video of my mind. Thanks for sharing.
Man probably just doxxed himself for educational purposes. What a legend. Truly brings a tear to my eyes. 🥺
this + a portable monitor and keyboard 😍
Awesome thank you man. Great 🔥
No problem 👍
I don't get this, why do this when you still need the physical server in addition to your phone/tablet anyway? Why not just remote into your server on VNC, TeamViewer etc. and just use VS Code there? You can access the whole server desktop as well as VS Code then? Am I missing something? Surely the point is to actually run VS Code on your phone via Linux emulation and not need a physical server?
I’m trying to get into the config file but I don’t have links like you do in my terminal! I don’t know how to open the config file! Helppp
It should start off with an IP address
You can run vs code on Android easily with termux.
Is it ?
umm ok
How??
Don't work :(
Yes .. Exactly ... !
You lost me after one second , I will forget about this idea and go with codepen 😃
You're awesome Adrian.
Sir I'm confused vs code IS available in the play store as an app to download so why do all this?
how to get a terminal for ios ;-;
Great, But I sense security breaches. Can't be trusted. But can be tested. 👍🏻
Yep security is a must with this one
Helpful, Liked & you got subscriber too ☺️
That's great. But for me uncomfortable to code on a mobile phone. Thanks for sharing
That trick is very unique and simple i like it.
Hey!! Bro when i running any python program it is asking to install python but i don't know how to do that so please do something for it ❤️❤️
sh : The term 'sh' is not recognized as the name of a cmdlet, function, script file, or operable program. Check the spelling of the name, or if
a path was included, verify that the path is correct and try again.
Also, how did you create it as an 'app' (link to browser type thing) on your iphone? Thanks!
u need to get a linux terminal
While an interesting approach, a much better way would be to use one of the many existing Web based IDEs that actually just VSCode. I forget the name of the product, but I'm sure someone else might remember
Spck editor is good to go👍
"runs maybe even on Linux"
XD
like.. bruh
Linuix in phone is possible
Do not attempt to do this at home. Do not port-forward anything to your personal computer. It’s a major security risk.
It’s like giving the whole world access to this service. It’s bad. Use an external server. Someone can easily find your use one days on your vscode plug-in and bypass the password accessing your personal information and changing it.
Do you recommend using Mac for programming? I have seen that it has a lot of problems using some frameworks. Would like to know your opinion :) .
I use macOS, Windows and Linux daily. My preference is to run Linux for development.
I used a bit of everything, depending on the use case
I'll have to try Linux a bit more
This is so Cool Video . Just Love It
OMG, why is this guy dancing while talking.?? hahaha
I have too much energy!
This is the video I am looking for
Haha great!
This is an affordable option. I cannot move my laptop from its place (battery died) so my only portable option is my phone.
you move so much dude lol, but great quality video, loved it.
Like three days ago I was wondering if there is code editor app like for mobile phones, today I get a notification.
Perfect!
Don't code your phone. Trust me I've been in the situation Where I didn't have a laptop or desktop and Tried learning to code on a phone it was a waste of time because I couldn't test some applications.
Thanks for the video! I will try it! But first, is the VS code vim extension works? I came across several online editor all of them doesn't work in any browser in iOS (webkit)
Thank you
I wrote this in the terminal
yarn global add code-server
code-server &
Got the server link but don't know how to stop the server.
Just control c should cancel the terminal and session
@@AdrianTwarog Thanks a lot.
5:48 haha, epic video!
Nice background on your computer
drink a shot everytime the scene changes...or maybe not :D ha ha just kidding, great editing!
The question is not how, but why!
I just shared the vid to my friends 😂😂...
Haha that’s great you liked it!
I have a similar setup using Code Server, and it's my daily driver - even at home. Why at home? Because it has the ability to be installed 'natively' as a PWA! Since Electron is just a glorified PWA in the first place, it looks and feels as good as the native app with almost zero compromises, but with the added benefit of being able to simply disconnect whenever I like without ever stressing about losing work etc and picking it up wherever I am in the world.
👆send a direct message for support and guidance.
Good job bro👍🏻👍🏻
Great work! but code-server keeps losing the connection and I need to run the command every time. Any way to fix this?
Wow, that is amazing !!
Awesome thank you. 🤗
It's cool but I need my physical keyboard to work.. not phone keyboard 😅
Good point!
Just connect your physical keyboard to phone using otg
Hi Adrian, I tried this but its not working for me. I have macos and vs code but its not working. Any ideas about that? Thanks
There is also an alternative
When you are on your github repo just press "." and VSCode will open with your account.
👆send a direct message for support and guidance.
Awesome video! I was just wondering, by doing the first part of this video (the config and ip address and by putting in that url) will that install anything on my wifi network and/or on my computer?
Meanwhile Android users: Downloads vhe editor from Play store
It runs vs code virtually so no PC is required and using this application u can also save files to your local machine (phone)
It's great, thank you:)
Can you please also tell about how to add a ssl to the ip address?
Your gestures are cool
Funny how ppl differentiate Macs from PCs like Mac aint a PC....we shld separate windows too 😂
hahah good point
Didn't like Apple themselves separate it too in commercial?
i guess using the broadcast will find some servers ;) ..do you have an idea how much data is transferred over the internet? speaking of how heavy it is on your data plan.. 2ndly.. can you run terminal commands to be executed on the remote machine? like compiling the code and run a the jar or whatsoever?
Yes
WATCHING!
sadly this is too lag in my 3gb ram phone android 11, so I still use acode editor, basically I face no issue with acode editor, its fast and can edit file that located in termux home directory, can do sftp that also fast, it has some extention that usefull like tailwind completetion, color preview, etc, but it lacks advance extention that available in vscode that make me want to try install it in my phone like golang/rust extention but actually it is not big deal because I can see the error in termux and browse the syntax, just want to try to improve productivity by simplifying thing if possible
isnt 255.255.255.255 the broadcast address of every network?
Nice find, I was a bit cheeky here, not many people noticed!
Thanks, I have a question and I hope you dont find it rude:
why in all your pictures you catch your chin? what's with the chin?
I reply don’t know, but now that I started, I can’t stop! It’s almost iconic!
I think he thinks a lot!! Lol😂😂
IMHO : why? 🙃 I would prefer taking my windows tablet and work there. But to take it to other platform such as iOS / Android, this is great!
This was heaps of fun to do, if you want to check out another cool vid, watch th-cam.com/video/GMn9sxCWN0M/w-d-xo.html shows you what a day in my life looks like!
Is there a way to do it in windows... Using workspace will be a little overkill if it's just for editing using phones or tablets, I guess. Can you please post a video for windows too!
Hi Adrian, I encountered my MacBook Pro shutting down and restarting every time I connect from my iPad...wonder why that would be?
@@joonyoon1626 hardware error maybe?
Give me name apps phone.
If it can run in a server on your laptop, can it run in a server on your phone?
Smashed the like button!
Boom! Yes!
I facing a issue : "error Please specify at least one file or folder" what is solution to this please answer !!
When im trying to Connect to it via my mobile device. Its not loading. but if i use my public ip it loads but asks me for Sign in. ""my ip" requires a username and password. Your connection to this site is not private
👆send a direct message for support and guidance.
Thanks buddy
No problem 👍
Hello,
As i was setting uo Visual studio i kind of broke it, now it doesn't let me debug the code? Please help
lol we have the same monitor
nice vid :)
just install termux and then configure vim as you like and use it on your phone .
Yeah that works too!
We’re not all totally insane however 🧐
had to stop three minutes into your video cuz I kept running into issues with my terminal. do you think you could help me out with it. 'im not currently having much luck using terminal in the way you did
this is a problem for me because i need to use vs code on my android tablet without my computer being on
Lovely, nice content.
Can someone please tell me what that is @ 3:36 and what it's use is? The very small text on the upper right of his VS Code program. I have that too. Its the thing right next to the scroll bar. It erks me because I dont know what it does or how to toggle it off.
When I try to type the command to install it it says that sh is not a command. Can someone please help!
i did not have laptop or computer or macbook. how i can install or run in chrome
I don't get to see the configuration file where I could get to change the password as a link. Any assistance with that?
Hi, I got 'error listen EADDRINUSE: address already in use 127.0.0.1:8080' message...what I can do?
O... Mój piętnastoletni syn Adrian też ma pudełka od sprzętów na półce... Wspólna cechą Adrianów? :-)
👆send a direct message for support and guidance.
Can we run angular in visual studio code or any other IDE on ipad pro?