OLD | NEW |
1 {{+bindTo:partials.standard_nacl_article}} | 1 {{+bindTo:partials.standard_nacl_article}} |
2 | 2 |
3 <section id="building-a-nacl-app"> | 3 <section id="building-a-nacl-app"> |
4 <span id="io2014"></span><h1 id="building-a-nacl-app"><span id="io2014"></span>B
uilding a NaCl App</h1> | 4 <span id="io2014"></span><h1 id="building-a-nacl-app"><span id="io2014"></span>B
uilding a NaCl App</h1> |
5 <h2 id="in-the-browser">In the browser!</h2> | 5 <h2 id="in-the-browser">In the browser!</h2> |
6 <p>Follow along with Brad Nelson’s Google I/O 2014 talk. | 6 <p>Follow along with Brad Nelson’s Google I/O 2014 talk. |
7 Explore our new in-browser development environment and debugger.</p> | 7 Explore our new in-browser development environment and debugger.</p> |
8 <p>Learn how easy it is to edit, build, and debug NaCl application | 8 <p>Learn how easy it is to edit, build, and debug NaCl application |
9 all in your desktop web browser or on a Chromebook. | 9 all in your desktop web browser or on a Chromebook. |
10 Work either on-line or off-line!</p> | 10 Work either on-line or off-line!</p> |
11 <iframe class="video" width="500" height="281" | 11 <iframe class="video" width="500" height="281" |
12 src="//www.youtube.com/embed/OzNuzBDEWzk?rel=0" frameborder="0"></iframe><h3 id=
"work-in-progress">Work in Progress</h3> | 12 src="//www.youtube.com/embed/OzNuzBDEWzk?rel=0" frameborder="0"></iframe><h3 id=
"our-web-based-tools">Our Web-based Tools</h3> |
13 <p>These development tools are a work in progress, see <a class="reference inter
nal" href="#feature-status">Feature Status</a>. | 13 <p>These development tools are a <a class="reference external" href="nacldev">wo
rk in progress</a>. |
14 At this point, they are a learning tool and demonstration of NaCl’s | 14 At this point, they are a learning tool and demonstration of NaCl’s |
15 flexibility, but are not the recommended tools for a production application. | 15 flexibility, but are not the recommended tools for a production application. |
16 To develop a substantial application for Native Client / | 16 In the future, that may change, but for the moment, |
| 17 to develop a substantial application for Native Client / |
17 Portable Native Client, | 18 Portable Native Client, |
18 we currently recommend you use the | 19 we recommend you use the |
19 <a class="reference external" href="/native-client/sdk/download">Native Client S
DK</a>.</p> | 20 <a class="reference external" href="/native-client/sdk/download">Native Client S
DK</a>.</p> |
20 <b><font color="#880000"> | 21 <b><font color="#880000"> |
21 NOTE: The NaCl Development Environment is not yet stable. | 22 NOTE: The NaCl Development Environment is not yet stable. |
22 Ideally user data is preserved, but currently it can be lost during updates | 23 Ideally user data is preserved, but currently it can be lost during updates |
23 or sporadically. We're working to resolve this. | 24 or sporadically. We're working to resolve this. |
24 </font></b><h3 id="installation">Installation</h3> | 25 </font></b><h3 id="installation">Installation</h3> |
25 <p>The setup process currently requires several steps. | 26 <p>The setup process currently requires several steps. |
26 We’re working to reduce the number of steps in future releases. | 27 We’re working to reduce the number of steps in future releases. |
27 As the process gets easier, we’ll update this page.</p> | 28 As the process gets easier, we’ll update this page.</p> |
28 <p>To install the development environment:</p> | 29 <p>To install the development environment:</p> |
(...skipping 22 matching lines...) Expand all Loading... |
51 <li><p class="first">Navigate to: chrome://flags and:</p> | 52 <li><p class="first">Navigate to: chrome://flags and:</p> |
52 <ul class="small-gap"> | 53 <ul class="small-gap"> |
53 <li>Enable <strong>Native Client GDB-based debugging</strong>.</li> | 54 <li>Enable <strong>Native Client GDB-based debugging</strong>.</li> |
54 <li>Restart your browser by clicking <strong>Relaunch Now</strong>.</li> | 55 <li>Restart your browser by clicking <strong>Relaunch Now</strong>.</li> |
55 </ul> | 56 </ul> |
56 </li> | 57 </li> |
57 <li>NOTE: If you experience unexplained hangs, disable GDB-based debugging | 58 <li>NOTE: If you experience unexplained hangs, disable GDB-based debugging |
58 temporarily and try again.</li> | 59 temporarily and try again.</li> |
59 </ul> | 60 </ul> |
60 </div></blockquote> | 61 </div></blockquote> |
61 <h3 id="editor">Editor</h3> | 62 <h4 id="editing">Editing</h4> |
62 <p>To follow along in this tutorial, you’ll need to use a text editor to m
odify | 63 <p>To follow along in this codelab, you’ll need to use a text editor to mo
dify |
63 various files in our development environment. | 64 various files in our development environment. |
64 There are currently two editor options, nano or vim. | 65 There are currently two editor options, nano or vim. |
65 Emacs is coming soon... | 66 We have an Emacs port, but it is not yet available in the Dev Environment |
| 67 (coming soon). |
66 If you’re unsure what to pick, nano is simpler to start with and has on-sc
reen | 68 If you’re unsure what to pick, nano is simpler to start with and has on-sc
reen |
67 help.</p> | 69 help.</p> |
68 <ul class="small-gap"> | 70 <ul class="small-gap"> |
69 <li><p class="first">You can open <strong>nano</strong> like this:</p> | 71 <li><p class="first">You can open <strong>nano</strong> like this:</p> |
70 <pre class="prettyprint"> | 72 <pre class="prettyprint"> |
71 $ nano <filename> | 73 $ nano <filename> |
72 </pre> | 74 </pre> |
73 <p>Here’s an online <a class="reference external" href="http://mintaka.sds
u.edu/reu/nano.html">nano tutorial</a>.</p> | 75 <p>Here’s an online <a class="reference external" href="http://mintaka.sds
u.edu/reu/nano.html">nano tutorial</a>.</p> |
74 </li> | 76 </li> |
75 <li><p class="first">You can open <strong>vim</strong> like this:</p> | 77 <li><p class="first">You can open <strong>vim</strong> like this:</p> |
76 <pre class="prettyprint"> | 78 <pre class="prettyprint"> |
77 $ vim <filename> | 79 $ vim <filename> |
78 </pre> | 80 </pre> |
79 <p>Here’s an online <a class="reference external" href="http://www.openvim
.com/tutorial.html">vim tutorial</a>.</p> | 81 <p>Here’s an online <a class="reference external" href="http://www.openvim
.com/tutorial.html">vim tutorial</a>.</p> |
80 </li> | 82 </li> |
81 </ul> | 83 </ul> |
82 <h3 id="git-setup">Git Setup</h3> | 84 <h3 id="git-setup">Git Setup</h3> |
83 <p>This tutorial also uses a revision control program called | 85 <p>This tutorial also uses a revision control program called |
84 <a class="reference external" href="http://en.wikipedia.org/wiki/Git_(software)"
>git</a>. | 86 <a class="reference external" href="http://en.wikipedia.org/wiki/Git_(software)"
>git</a>. |
85 In order to commit to a git repository, | 87 In order to commit to a git repository, |
86 you need to setup your environment to with your identity.</p> | 88 you need to setup your environment to with your identity.</p> |
87 <p>You’ll need to add these lines to <cite>~/.bashrc</cite> to cause them
to be invoked each | 89 <p>Run these commands (with your info) to setup your <cite>~/.gitconfig</cite> |
88 time you start the development environment.</p> | 90 for use:</p> |
89 <pre class="prettyprint"> | 91 <pre class="prettyprint"> |
90 git config --global user.name "John Doe" | 92 git config --global user.name "John Doe" |
91 git config --global user.email johndoe@example.com | 93 git config --global user.email johndoe@example.com |
92 </pre> | 94 </pre> |
93 <p>You can reload you <cite>~/.bashrc</cite> by running:</p> | |
94 <pre class="prettyprint"> | |
95 source ~/.bashrc | |
96 </pre> | |
97 <h3 id="tour-follow-the-video">Tour (follow the video)</h3> | 95 <h3 id="tour-follow-the-video">Tour (follow the video)</h3> |
98 <p>Create a working directory and go into it:</p> | 96 <p>Create a working directory and go into it:</p> |
99 <pre class="prettyprint"> | 97 <pre class="prettyprint"> |
100 $ mkdir work | 98 $ mkdir work |
101 $ cd work | 99 $ cd work |
102 </pre> | 100 </pre> |
103 <p>Download a zip file containing our sample:</p> | 101 <p>Download a zip file containing our sample:</p> |
104 <pre class="prettyprint"> | 102 <pre class="prettyprint"> |
105 $ curl http://nacltools.storage.googleapis.com/io2014/voronoi.zip -O | 103 $ curl http://nacltools.storage.googleapis.com/io2014/voronoi.zip -O |
106 $ ls -l | 104 $ ls -l |
(...skipping 99 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
206 $ git log | 204 $ git log |
207 </pre> | 205 </pre> |
208 <p>Run the demo again. And everything now works:</p> | 206 <p>Run the demo again. And everything now works:</p> |
209 <pre class="prettyprint"> | 207 <pre class="prettyprint"> |
210 $ make serve | 208 $ make serve |
211 </pre> | 209 </pre> |
212 <h3 id="thanks">Thanks</h3> | 210 <h3 id="thanks">Thanks</h3> |
213 <p>Thanks for checking out our environment. | 211 <p>Thanks for checking out our environment. |
214 Things are rapidly changing and in the coming months you can expect to see | 212 Things are rapidly changing and in the coming months you can expect to see |
215 further improvements and filling out of our platform and library support.</p> | 213 further improvements and filling out of our platform and library support.</p> |
216 <p>Check back at this page for the latest status.</p> | 214 <p>Follow the status of the NaCl Dev Environment at <a class="reference external
" href="naclenv">this page</a>.</p> |
217 <h3 id="feature-status">Feature Status</h3> | |
218 <p>Here is a summary of feature status. We hope to overcome these limitations | |
219 in the near future:</p> | |
220 <blockquote> | |
221 <div><ul class="small-gap"> | |
222 <li><p class="first">NaCl Development Environment</p> | |
223 <ul class="small-gap"> | |
224 <li><p class="first">General</p> | |
225 <ul class="small-gap"> | |
226 <li><p class="first">Supported:</p> | |
227 <ul class="small-gap"> | |
228 <li>Python (built-in)</li> | |
229 <li>GCC w/ GLibC (x86-32 and x86-64 only)</li> | |
230 <li>Lua (install with: <cite>package -i lua && . setup-environment</cite
>)</li> | |
231 <li>Ruby (install with: <cite>package -i ruby && . setup-environment</ci
te>)</li> | |
232 <li>Nethack! (install with: <cite>package -i nethack && . setup-environm
ent</cite>)</li> | |
233 </ul> | |
234 </li> | |
235 <li><p class="first">Unsupported:</p> | |
236 <ul class="small-gap"> | |
237 <li>Targeting Newlib</li> | |
238 <li>Targeting PNaCl</li> | |
239 <li>Forking in bash</li> | |
240 <li>Pipes / Redirection</li> | |
241 <li>Symbolic and hard links</li> | |
242 </ul> | |
243 </li> | |
244 </ul> | |
245 </li> | |
246 <li><p class="first">Missing / broken on ARM:</p> | |
247 <ul class="small-gap"> | |
248 <li>Git (broken)</li> | |
249 <li>GCC (unsupported)</li> | |
250 </ul> | |
251 </li> | |
252 </ul> | |
253 </li> | |
254 <li><p class="first">Debugger</p> | |
255 <ul class="small-gap"> | |
256 <li>Runs reliably only on a recent Beta or Dev Channel (M36+) build.</li> | |
257 <li><p class="first">Currently unreliable on some platforms:</p> | |
258 <ul class="small-gap"> | |
259 <li>ChromeOS</li> | |
260 <li>Mac OSX</li> | |
261 <li>Windows</li> | |
262 </ul> | |
263 </li> | |
264 </ul> | |
265 </li> | |
266 </ul> | |
267 </div></blockquote> | |
268 </section> | 215 </section> |
269 | 216 |
270 {{/partials.standard_nacl_article}} | 217 {{/partials.standard_nacl_article}} |
OLD | NEW |