Just written a HTML document using VSCode. When i run via Chrome it opens a window on localhost:8080, but says that the site cannot be reached. 'Refused to connect'
Can anyone tell me where I'm going wrong?
Usually use Notepad++ which i realise is so much more straightforward than VSCode.
Thanks.
You can just click on the file and it will run automatically.
You don't need localhost to view an HTML page, just find the HTML on your desktop or documents or where ever you created it, right click on the file and open it with a browser of your choice
You can then edit the file in VSCode or Notepad++ or any text editor of your liking, then go back to the browser and reload the page to see the changes to your file
You enter your project. And you can run as writing 'ng serve'. VSCode will show your localhost and you should press it to run the project.
[Javascript],[VisualStudioCode],[AngularJS]
Related
I am new to Blazor and trying to show File Saveas Dialog as shown in following link on a button click.
Save as Image
The requirement is - upon clicking the Saveas button above Saveas dialog should be popped up where user can choose the destination of file and file name.
I have tried "enabling the setting to check the save location in the download settings of the browser" and it works. But we do not want to depend on the Browser settings.
Please add your thoughts on below..
Instead of depending on the browser settings is there any other way to show Saveas dialog?
Are there any open source Nuget packages available to help on this?
NOTE: I am using .NET 6.0 for building my application
Thanks in advance,
Bhargavi Gowri.
I also wanted to bring up a window to save a file in which the user could select a folder. Before that, the system automatically saved to the Downloads folder.
As I understood, there was no such possibility before, but now it is possible thanks to this api: https://caniuse.com/native-filesystem-api.
I found this solution in the answer to this question: https://stackoverflow.com/a/70001920/16740180.
It's worth noting that I use Blazor WebAssembly and not a Blazor Server. And I do not know if it will work for you.
Unfortunately, this doesn't work for mobile devices right now, but it works fine for windows. I hope this helps someone.
This isn't a Blazor thing. In web browsers, files are downloaded from links using <a> tag in HTML using the download attribute. Just create a link to your file:
<a href="path_to_file" download>Save</a>
Save
The path must be on the same server, but blob and data links will work as well.
If you do not suggest a name, the browser will use the original filename (possibly changed to remove symbols the OS doesn't allow in file paths).
https://caniuse.com/download
If you want your link to look like a button, then that's a different issue, and you can google or ask that.
I am a starter in programming. One of my friends told me that I can start programing without installing any app and that I need only notepad to start learning HTML. The thing I can't find out is how I actually make it work. I inputted the code he gave me and I also made sure there where no typos, but then after I saved it I can not open it as a local file. I have only been able to open it as a text document so I can only see the code.
For this you have to save the file you are working on with the extension: .html. Then you have to open it with a browser, and you will see there the content of it
you can create a notepad and save it as name.html (not as .txt)
write the code inside it.
You can start with the notepad software. Unfortunately, this is not the best option. In fact, specialized software is recommended. Thanks to them, you will be able to write code faster thanks to the suggestions made by the software or to the very useful shortcuts! If you want to use this software, I recommend you one of the best on the market: Visual Studio Code.
If however you want to stay with notepad, you just have to click on "File" > "Save as" and to choose the type of file you want. In your case, it will be .html (Hypertext Markup Language)
You can create a file called [filename].html, and right click on it to open it in notepad. After Editing the file and adding your code to it, you can double click on it and it will open in your browser.
If you start enjoying to code, getting an IDE will make it much better. Visual Studio Code is recommended for this as it is user friendly and won't take up much storage space :)
code.visualstudio.com - Visual Studio Code
After saving the HTML code save it as filename.html, make sure that file extension is .html otherwise the filesystem will not recognized it.
Then right click on the file and open it with chrome or whatever browser you have and it will work, else open browser and drag it to browser and drop it, your html page will open in browser.
I write HTML and CSS code in VS Code and for previewing it I need to open file explorer then files then double click them to open them in my default browser.
it takes too much time. is there any proper way for this?
I have tried one live extension called live server but the problem with it is we have to click the 'go live' button any time I want to refresh the code.
If the live server extension is the one by Ritwick Dey..
.. then then after clicking Go Live, it will open your page in the default browser and reload it automatically, every time you save your work.
in some cases, it is helpful to save the folder containing your HTML to a Workspace, in VS Code, especially if you are writing an app using the MVC modal and the HTML and CSS are in subfolders.
You can install an extension called open in browser.
After installation complete restart vscode and go to settings Ctrl + ,. Search for Open-in-browser setting and set your default browser as you can see below:
Then whenever you edit a html file, you can use shortcut Alt + B to open this file in browser.
I am learning javascript in vscode and using liveServer extension to get my html and js runnning on chrome...and i see my js output in "inspect element->console" which works perfectly fine...now i have seen chrome developers tools integrated in vscode and you can open them in vscode from help and then selecting developers tools.....but thing is i dont get my js output there...how to do that....i am learning from tutorial on youtube--"https://www.youtube.com/watch?v=W6NZfCO5SIk" and he is doing the exact thing from the time stamp 16:11 (variable section), that i want.
i have tried changing the ports of liveserver and setting the default browser to null which eventually open edge browser.
all this happens when i go live with the live server extension.
i expect my js output on that console but i get this:
[Extension Host] [32mServing "c:\VCodeCpp\" at http://127.0.0.1:5500[39m
workbench.main.js:238 [Extension Host] [36mReady for changes[39m-------
and when change something in js file, it says
[Extension Host] [36mChange detected[39m c:\VCodeCpp\index.js----------
while the output in chrome is perfectly fine
It sounds like you are on the right track with the live server extension, from what I can tell in the video you linked what you are referring to is the Debugger for Chrome visual studio code extension.
This can be downloaded within visual studio code in the extensions panel after searching
"debugger for chrome"
Download through that link or directly within VS Code
If you use that along with the web server, You would just first need to link the debugger to the port the server is on you should see the output in the chrome-tools.
Follow this Guide on
Getting started with Chrome Tools in VS Code
I hope this helps, as I am still new to answering on SO but this looked like something I could make a solid attempt.
In addition to enabling the "debugger for chrome" extension, please check for the Javascript console.log () output in the VS Code "DEBUG CONSOLE" tab, instead of in the usual "TERMINAL" tab. You'll probably have to hit F5 for the output to show up.
This method "sorta" worked for me -- but it wasn't fully reliable: I didn't get all the output I expected. Still, I think it's how it's "supposed" to work.
I like how when I use F12 on chrome I can edit a page live and check the source files and all that, but I would like to be able to use this on my own website so that every edit I make using F12 is instantly saved to the local html/css file. I like the live output is what I mean. Are there any programs like this? I've tried extensions as well but they all seem to be standalone nothing to do with the website I am browsing through. Is there any way to run F12 as the owner of the website?
No its NOT possible.
However, you can use a scrapping software like Httrack and copy the entire remote website's CSS, JS and HTML files on your local system and then you can edit files manually using any text editor or IDE of your choice.