创建和运行你的第一个Web项目

熟悉PhpStorm建议你从头开始创建你的第一个项目,实现最基本的功能。

先创建并运行您的Web项目:

创建一个项目，对于这个，在主菜单中选择 File | New | Project ,新建项目对话框被打开。
在左边的窗格中，选择Empty Project。
在右边的窗格中,指定文件夹的路径来创建项目，例如：C:\MY_PROJECTS\JAVA_SCRIPT_PROJECTS\MyFirstWebProject ，在Location 文本框手动输入或者点击文本框旁边的Browse 按钮。在打开的对话框选择目标文件夹。PhpStorm组成项目文件夹的路径如下:

点击Create，然后就好了。
创建一个HTML文件，对于这个，在项目工具窗中右键点击项目目录，指向右键菜单上的New，然后选择HTML File
在打开的新建HTML文件对话框中输入MyFile 然后点击OK。PhpStorm将为您创建存根文件,在专门的编辑器选项卡中打开它。

在<html />标签中输入示例代码:

 <html>
 <head>
     <script src="http://api-maps.yandex.ru/2.0/?load=package.full&lang=ru-RU"></script>
     <title>Your first Web project</title>
 </head>
 <body>
 <div id="map" style="width: 400px; height: 300px"></div>
 <label for="latitude">Latitude:</label>
 <input type="text" id="latitude" value="59.942402"/><br/>
 <label for="longitude">Longitude:</label>
 <input type="text" id="longitude" value="30.293661"/><br/>
 <input type="submit" value="Show map" onclick=" showMap(document.getElementById('latitude').value,document.getElementById('longitude').value);"/>
     <script type="text/javascript">
         function showMap (latitude, longitude) {
             var myMap = new ymaps.Map('map',{
                         center:[latitude, longitude],
                         zoom:16
                     });
                  }
     </script>
 </body>
 </html>

保存文件，选择File | Save All 或者按 Ctrl+S。
运行你的程序，按照以下之一去做：
- 选中View | Open in Browser，然后从列表中选择想用的浏览器。
- 在浏览器工具栏点击想用的浏览器:
这个页面在浏览器中已经打开了，点击Show Map按钮，Yandex地图显示出来了，显示在圣彼得堡IntelliJLabs办公室的位置。

另请参阅：

规程：

在浏览器中预览页面Web内容

参考:

新建项目对话框

入门指南：

用户界面引导