Hi, this is Charu from Classmethod. In this hands-on blog, we'll explore different methods to test your HTML files locally, from basic approaches like opening files directly to more advanced options involving local servers and specialised tools.
Opening your HTML file directly in a browser is the most straightforward method. Simply navigate to the file location on your computer and open it in the browser. However, keep in mind that if your website involves API calls, you might encounter CORS restrictions which I faced while testing mine.
2. Local Server:
Make the following changes in your tsconfig.json file,
To convert your TS files into JS, run the following command,
To setup a local server, install it globally using the following command,
npm install -g http-server
Finally, run the following command to run your server,
You can click on the localhost link displayed to view your HTML page.
3. VS Code Live Server Extension:
You can also use Live Server extension in your VS code. This tool allows you to serve static files, on a local server.
You need to install this extension in your VS code,
Click on the 'Go Live' button at the bottom, right-click on your HTML file, and select "Open with Live Server"
4. Online HTML Editors:
To test your HTML file you can experiment with these approaches and find the one which enhances you web development experience.
Thank you for reading!