-
Notifications
You must be signed in to change notification settings - Fork 357
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge branch 'Mikael-Sundstrom-master'
- Loading branch information
Showing
5 changed files
with
84 additions
and
104 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,30 +1,31 @@ | ||
| # Frequently Asked Questions | ||
|
|
||
| ## PHP will download instead of executing | ||
| I'm a new to this live server thing but for .html it worked perfectly fine! But now when I want to use it for .php it want's me to download it instead of executing it. | ||
| <br> | ||
|
|
||
| How can I fix it? | ||
| ### PHP will download instead of executing | ||
| I'm new to this live-server thing. I have used it for *`.html`* pages, and it worked flawlessly! But now, when I want to use it for php pages, it downloads the .php file instead of executing it. | ||
|
|
||
| **Answer:** | ||
| 1. [The Common Misconceptions](#the-common-misconceptions) | ||
| 2. You will need to install a server on your machine or download the necessary requirements. Here is a Stackoverflow question: [PHP server on local machine?](https://stackoverflow.com/questions/1678010/php-server-on-local-machine) | ||
| + [PHP](http://php.net/downloads.php) (just the preprocessor) | ||
| + [PHP](http://php.net/downloads.php) (just the preprocessor without apache) | ||
| + [XAMPP](https://www.apachefriends.org/index.html) (cross-platform) | ||
| + [MAMP](https://www.mamp.info/en/downloads/) (mac) | ||
| + [WAMP](http://www.wampserver.com/en/) (windows) | ||
| + [AppServ](https://www.appserv.org/) (windows) | ||
| 3. Visit the ***Actual Server Address***: `http://localhost:[port_number]/[workspace]`, not the VS Code extension's ***Live Server Address***: `http://127.0.0.1:5500/` | ||
|
|
||
| <br><hr> | ||
|
|
||
| ## Another question | ||
| <br><br><hr><br> | ||
|
|
||
| <!-- ### Another question | ||
| Lorem ipsum dolor | ||
| **Answer:** | ||
| Lorem ipsum dolor | ||
| <br><hr> | ||
| <br><hr><br> --> | ||
|
|
||
| >## The Common Misconceptions | ||
| >Neither the browser add-on nor the VS Code extension will host a server for: `PHP`, `ASP.NET` or `NodeJS`. It will give you the *reloading function*, so you do not need to refresh the page every time you save. | ||
| >Neither the browser add-on nor the VS Code extension will host a server for: `PHP`, `.NET` or `NodeJS`. It will give you the *reloading function*, so you do not need to refresh the page every time you save. | ||
| > | ||
| >The reason I built this browser add-on is to delight the experience of server-side programming. The server-side is heavier than the client-side because it needs a larger server environment to run and preprocess your code in: `php`, `nodejs` and `asp.net`. | ||
| >The reason I built this browser add-on is to delight the experience of server-side programming. The server-side is heavier than the client-side because it needs a larger server environment to run and preprocess your code in: `PHP`, `NodeJS` or `.NET`. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,100 +1,77 @@ | ||
| # Setup | ||
| >#### The Common Misconceptions | ||
| >Neither the browser add-on nor the VS Code extension will host a server for: `PHP`, `ASP.NET` or `NodeJS`. It will give you the *reloading function*, so you do not need to refresh the page every time you save. | ||
| #### The Common Misconceptions | ||
| Neither the browser add-on nor the VS Code extension will host a server for: `PHP`, `.NET` or `NodeJS`. It will give you the *reloading function*, so you do not need to refresh the page every time you save. | ||
|
|
||
| In other words. If you just want the reload function when you work with `.html` files, then you do not need this extension at all. | ||
|
|
||
| <br> | ||
|
|
||
| ***Need Help? [Watch Video Tutorial](https://www.youtube.com/watch?v=54wcX1G2GH8)*** | ||
|
|
||
| <br><hr> | ||
|
|
||
| ## There are two ways to setup `Live Server Web Extension`. | ||
| <br><br> | ||
|
|
||
| 1. [Direct Setup](#direct-setup) (Easy) | ||
| 2. [Proxy Setup](#proxy-setup) (Advanced) | ||
|
|
||
| <br><hr> | ||
| # Direct Setup<sup><sub><sup>`Easy`</sup></sub></sup> | Proxy Setup<sup><sub><sup>`Advanced`</sup></sub></sup> | ||
|
|
||
| ## Direct Setup | ||
| ### Direct Setup | ||
|
|
||
| 1. Install [VS Code](https://code.visualstudio.com/download) from Microsoft (code editor). | ||
| 2. Install VS Code [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer) (extension). | ||
| 1. Install [VS Code](https://code.visualstudio.com/download) from Microsoft. <sup>(code editor)</sup> | ||
| 2. Install VS Code [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer). <sup>(extension to code editor)</sup> | ||
| 3. Install the browser add-on; [Chrome](https://chrome.google.com/webstore/detail/live-server-web-extension/fiegdmejfepffgpnejdinekhfieaogmj/) or [Firefox](https://addons.mozilla.org/en-US/firefox/addon/live-server-web-extension/). | ||
| 4. Install and run a server on your machine | ||
| + [PHP](http://php.net/downloads.php) (just the preprocessor) | ||
| + [XAMPP](https://www.apachefriends.org/index.html) (cross-platform) | ||
| + [MAMP](https://www.mamp.info/en/downloads/) (mac) | ||
| + [WAMP](http://www.wampserver.com/en/) (windows) | ||
| 4. Install and run a server on your machine: [Servers and Frameworks](#servers-and-frameworks) | ||
| 5. Enter the neccesary fields (screenshot below) | ||
| + **Actual Server Address:** is the address where your server is located and the port. | ||
| + **Live Server Address:** is the address where your VS code extension is running. | ||
| 6. Push the Go Live-button in your editor. | ||
| 1. **Actual Server Address:** is the address where your server is located and the port. | ||
| 2. **Live Server Address:** is the address where your VS code extension is running. | ||
| 6. Push the `Go Live`-button in your editor's statusbar. | ||
| 7. Visit the `Actual Server Address` | ||
|
|
||
|  | ||
|  | ||
|
|
||
| <br><hr> | ||
|
|
||
| ## Proxy Setup | ||
| ### Proxy Setup | ||
| 1. Install [VS Code](https://code.visualstudio.com/download) from Microsoft. <sup>(code editor)</sup> | ||
| 2. Install VS Code [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer). <sup>(extension to code editor)</sup> | ||
| 3. Install the browser add-on; [Chrome](https://chrome.google.com/webstore/detail/live-server-web-extension/fiegdmejfepffgpnejdinekhfieaogmj/) or [Firefox](https://addons.mozilla.org/en-US/firefox/addon/live-server-web-extension/). | ||
| 4. Install and run a server on your machine: [Servers and Frameworks](#servers-and-frameworks) | ||
| 5. Enter the neccesary values (code block below) | ||
| 1. **Proxy Address:** is the folder you want proxy from. The path is relative to the workspace. | ||
| 2. **Live Server Address:** is the address where your VS code extension is running. | ||
| 6. Push the `Go Live`-button in your editor's statusbar. | ||
|
|
||
| *`.vscode/settings.json`* | ||
| ```js | ||
| { | ||
| // Mainly for static files | ||
| "liveServer.settings.useWebExt": true, | ||
|
|
||
| * Install the extension on your browser. | ||
| * Install [`VSCode`](https://code.visualstudio.com/download) Editor & [`Live Server`](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer) Extension. | ||
| * Confiure Live Server settings (`.vscode/settings.json`) as follows : | ||
| // This means that you change your real URL (current PHP url) | ||
| // to another URL (which Live Sever starts). | ||
| "liveServer.settings.proxy": { | ||
| "enable": true, | ||
| "baseUri": "/", // i. Workspace folder. | ||
| "proxyUri": "http://localhost:80/workspace" // ii. Actual Server Address. | ||
| }, | ||
| } | ||
|
|
||
| ```js | ||
| //.vscode/settings.json | ||
| ``` | ||
| >**Note:** You need to stay on the new host that will be provided by Live Server. | ||
| { | ||
| // Mainly for static files | ||
| "liveServer.settings.useWebExt": true, | ||
| <br><br><hr> | ||
|
|
||
| /* | ||
| If you have dynamic pages (PHP), you have to setup proxy - it's pretty easy. | ||
| # Servers and Frameworks | ||
|
|
||
| In easy word, it means you're shifting your real url (actual PHP url) | ||
| to another url (which LiveSever will start). | ||
| */ | ||
| "liveServer.settings.proxy": { | ||
| "enable": true, //switch on :) | ||
| "baseUri": "/", //from where you want to proxy (live server). | ||
| "proxyUri": "http://127.0.0.1:80" //the actual server url (NOT live server). | ||
| }, | ||
| } | ||
|
|
||
| ``` | ||
| * ...And you're done! Just Open Live Server _`(ctrl+shift+p > "Open Live Server")`_ and don't forget to turn on live reload from your browser. | ||
| * Note: You have stay on the new url that will be given by Live Server. | ||
| ### PHP | ||
| + [PHP](http://php.net/downloads.php) <sup><sub>`just the preprocessor`</sub></sup> | ||
| + [XAMPP](https://www.apachefriends.org/index.html) <sup><sub>`cross-platform`</sub></sup> | ||
| + [MAMP](https://www.mamp.info/en/downloads/) <sup><sub>`mac`</sub></sup> | ||
| + [WAMP](http://www.wampserver.com/en/) <sup><sub>`windows`</sub></sup> | ||
|
|
||
| <!-- <br> | ||
|
|
||
| # All available VS Code settings | ||
| ```json | ||
| { | ||
| "liveServer.settings.AdvanceCustomBrowserCmdLine": null, | ||
| "liveServer.settings.ChromeDebuggingAttachment": false, | ||
| "liveServer.settings.CustomBrowser": "null", | ||
| "liveServer.settings.donotShowInfoMsg": false, | ||
| "liveServer.settings.donotVerifyTags": false, | ||
| "liveServer.settings.host": "127.0.0.1", | ||
| "liveServer.settings.https": { | ||
| "enable": false, | ||
| "cert": "", | ||
| "key": "", | ||
| "passphrase": "" | ||
| }, | ||
| "liveServer.settings.ignoreFiles": [ | ||
| ".vscode/**", | ||
| "**/*.scss", | ||
| "**/*.sass" | ||
| ], | ||
| "liveServer.settings.NoBrowser": false, | ||
| "liveServer.settings.port": 5500, | ||
| "liveServer.settings.proxy": { | ||
| "enable": false, | ||
| "baseUri": "/", | ||
| "proxyUri": "http://127.0.0.1:80" | ||
| }, | ||
| "liveServer.settings.root": "/", | ||
| "liveServer.settings.useWebExt": false | ||
| } | ||
| ``` --> | ||
| ### NodeJS | ||
| + [ExpressJS](https://expressjs.com/en/starter/installing.html) <sup><sub>`cross-platform`</sub></sup> | ||
|
|
||
|
|
||
| ### .Net | ||
| + [DotNet Core](https://www.microsoft.com/net/learn/get-started/windows) <sup><sub>`cross-platform`</sub></sup> | ||
| + [IIS](https://www.iis.net/) <sup><sub>`windows`</sub></sup> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters