《HTML5移动Web开发实战》—— 1.5 配置移动开发环境

1.5 配置移动开发环境

HTML5移动Web开发实战
适用浏览器:所有

在开始移动网站开发之前,我们必须首先配置好开发环境。

1.5.1 准备
1.配置本地网站服务。对于Windows、Mac和Linux,最容易的方法是使用免费的XAMPP软件:

http://www.apachefriends.org/en/index.html

2.确认你有无线网络。

3.同时你需要一个移动设备,或者是移动设备的仿真器、模拟器。

4.确保你的移动设备和电脑在同一无线网络中。

1.5.2 实践

1.在你的本地服务器根目录中创建一个HTML文件并命名为ch01e1.html,在其中输入如下代码:

2.获取你的IP地址。如果你使用的是Windows,你可以在命令行中输入如下命令:

3.当你获取到你的IP地址(如192.168.1.16),把它输入到移动浏览器的URL地址栏,然后你就可以看见页面加载成功并且显示图1-3所示的文字。

1.5.3 回顾

在同一个局域网中,你的移动设备可以通过IP地址访问以桌面电脑作为主机的服务器。

1.5.4 延伸

如果你没有移动设备,你可以使用某个仿真器来测试,但建议至少有一两个真实设备来测试。仿真器可以测试到大部分的情况,但不是所有的。

使用桌面版Safari测试
如果你的主要用户使用iPhone和移动版Safari,在桌面电脑上测试可以节约很多时间:打开Safari,在偏好设置中单击高级栏打开,在菜单栏中显示“开发”菜单,如图1-4所示。

在本页面中选择开发 | 用户代理 | Mobile Safari 3.1.3 – iPhone:

社区搜集的仿真器、模拟器
如果你没有智能手机,也可以使用很多仿真器、模拟器,你可以在Mobile Boilerplate项目的wiki页面找到:

https://github.com/h5bp/mobile-boilerplate/wiki/Mobile-Emulators-&-Simulators

Fritman搜集的仿真器、模拟器
Maximiliano Firtman,一个移动网站开发人员和作家,他维护了一个仿真器列表:

时间: 2024-11-08 15:25:55

《HTML5移动Web开发实战》—— 1.5 配置移动开发环境的相关文章

JavaScript使用DeviceOne开发实战(一) 配置和起步_javascript技巧

2015 年 9 月 底,DeviceOne Release发布.至此,DeviceOne 基本完成了对多端的支持.基于 DeviceOne 可以: HTML5.Android.iOS.Windows 多端代码一次编写,各处复用: 实时简单部署. 本地化UI 在接下来的时间,我会通过一系列文章来介绍 DeviceOne.本文介绍环境配置以及如何建立一个简单的项目.(注:本篇文章 iOS 和 Android和Windows 开发都适用.) 目前使用 DeviceOne 开发可以在Windows 或

《HTML5 Canvas游戏开发实战》——1.4 开发工具的选择

1.4 开发工具的选择 对于HTML5的开发来说,在开发工具方面没有特殊的要求,甚至可以用文本文档来编写代码.但是好的开发工具可以减少开发Bug,提高开发效率.对于网页设计者来说,Dreamweaver应该是最佳的选择,但由于 Dreamweaver没有调试功能,而且JavaScript的自动提示功能又不太好用,作为以代码编写为主的开发者来说,这是难以接受的.所以在这里推荐另一款开发工具,那就是Eclipse,它是完全免费的,而且也带有比较好的JavaScript提示功能.在下载Eclipse之

《React Native移动开发实战》一一2.1 开发具备的基础知识说明

2.1 开发具备的基础知识说明 日常生活中,人们越来越离不开的就是网购,因此,本书就以典型的电商类移动应用为例,向读者展示使用React Native设计.开发应用的全过程. 不过,在正式开发电商类移动应用之前,有必要先了解一些React Native开发的基础知识. 提示:本书面向对JavaScript有一定了解的读者,所以JavaScript相关知识本书不做深入解释,想要了解更多JavaScript知识,请读者参考相关书籍和教程. React Native开发中需要具备的基础知识如下. Gi

《AR与VR开发实战》——第一部分 AR开发

第一部分 AR开发 第1章 AR技术简介第2章 基于Vuforia SDK开发AR应用第3章 AR内容交互第4章 AR互动大屏:透明视频的实现第5章 AR动画:AR与Flash动画的结合第6章 AR游戏开发:卡牌对战第7章 涂色类AR开发第8章 使用陀螺仪模拟SLAM功能第9章 Unity与原生代码之间的交互第10章 使用HiAR SDK开发AR应用第11章 其他AR SDK简介第12章 AR创建工具:找趣(realcast)浏览器

Android之使用Android-query框架开发实战(一)_Android

开发Android使用Android-query框架能够快速的,比传统开发android所要编写的代码要少得很多,容易阅读等优势.  下载文档及其例子和包的地址:http://code.google.com/p/android-query/  以下内容是我学习的一些心得分享: 第一节: // 必须实现AQuery这个类 AQuery aq = new AQuery(view); // 按顺序分析:取得xml对应控件id,设置图片,设置可以显示,点击事件(方法someMethod必须是public

《Java和Android开发实战详解》——1.3节Java语言的开发环境

1.3 Java语言的开发环境 Java和Android开发实战详解 编程语言的"开发环境"(Development Environment)指的是一组工具程序,可用来创建.编译和维护编程语言所构建的应用程序.一般来说,我们可以使用两种Java开发环境来创建Java应用程序. 1.终端机模式的开发环境 或称为"命令行模式",对于传统MS-DOS或UNIX.Linux系统的用户,程序执行时的输入数据和输出数据都是使用"命令行界面"(Command-

求Xamarin.Forms开发实战基础篇

问题描述 Xamarin.Forms开发实战基础篇Xamarin.Forms开发实战基础篇Xamarin.Forms开发实战基础篇Xamarin.Forms开发实战基础篇介绍:本教程是国内第一本Xamarin.Forms开发专向教程.本教程针对Xamarin.Forms初学用户,全面细致的讲解Xmarin.Forms开发的各项基础知识.为了方便用户理解,每个知识点都配以完整实例.试读地址:链接:http://pan.baidu.com/s/1hqSOLaW 解决方案 解决方案二:为什么打不开

微信公众平台开发实战Java版之微信获取用户基本信息_java

在关注者与公众号产生消息交互后,公众号可获得关注者的OpenID(加密后的微信号,每个用户对每个公众号的OpenID是唯一的.对于不同公众号,同一用户的openid不同). 公众号可通过本接口来根据OpenID获取用户基本信息,包括昵称.头像.性别.所在城市.语言和关注时间. 开发者可通过OpenID来获取用户基本信息.请使用https协议. 我们可以看看官方的文档:获取用户的基本信息. 接口调用请求说明  http请求方式: GET https://api.weixin.qq.com/cgi-

Android之使用Android-query框架开发实战(二)_Android

在上篇文章跟大家介绍了Android之使用Android-query框架开发实战(一),本文继续跟大家介绍有关Android-query框架.具体内容请看下文. 异步网络: 1. 添加权限:<uses-permission android:name="android.permission.INTERNET" />  2. 支持的类型  JSONObject JSONArray String (HTML, XML) XmlDom (XML parsing) XmlPullPa

《HTML5移动Web开发实战》—— 1.3 配置移动开发工具

1.3 配置移动开发工具 HTML5移动Web开发实战适用浏览器:所有 在前一节还剩下一个问题没有回答:我应该在哪些设备和模拟器上测试?我们会在这一节回答. 如果你决定了需要支持的核心移动设备,那么现在就可以来看看如何配置了.如果在过多移动设备上测试,那么移动开发成本会很高,虽然我们可以使用移动设备的模拟器和仿真器,但都比不上在真实设备上做测试.现在我们来看看如何最大化测试覆盖率并最小化成本. 1.3.1 准备 我们会首先做一些假设,虽然具体情况可能不同,但思路是一样的.我们假设你的桌面操作系统