OLD | NEW |
1 {{+bindTo:partials.standard_nacl_article}} | 1 {{+bindTo:partials.standard_nacl_article}} |
2 | 2 |
3 <section id="what-a-difference-python-makes-codelab"> | 3 <section id="what-a-difference-python-makes-codelab"> |
4 <span id="cds2014-python"></span><h1 id="what-a-difference-python-makes-codelab"
><span id="cds2014-python"></span>What a difference Python Makes - Codelab</h1> | 4 <span id="cds2014-python"></span><h1 id="what-a-difference-python-makes-codelab"
><span id="cds2014-python"></span>What a difference Python Makes - Codelab</h1> |
5 <h2 id="introduction">Introduction</h2> | 5 <h2 id="introduction">Introduction</h2> |
6 <p>Learn how you can use client-side Python on your webpage. | 6 <p>Learn how you can use client-side Python on your webpage. |
7 Use the python <a href="https://docs.python.org/2/library/difflib.html" | 7 Use the python <a href="https://docs.python.org/2/library/difflib.html" |
8 target="_blank">difflib</a> module to generate attractive online | 8 target="_blank">difflib</a> module to generate attractive online |
9 textual diffs. | 9 textual diffs. |
10 Develop inside Google Chrome, using a hot off the presses version | 10 Develop inside Google Chrome, using a hot off the presses version |
(...skipping 25 matching lines...) Expand all Loading... |
36 } | 36 } |
37 </script></li> | 37 </script></li> |
38 <li>A fast broadband connection (500MB download)</li> | 38 <li>A fast broadband connection (500MB download)</li> |
39 <li>Can read and write Python</li> | 39 <li>Can read and write Python</li> |
40 </ul> | 40 </ul> |
41 </dd> | 41 </dd> |
42 </dl> | 42 </dl> |
43 <h2 id="setup">Setup</h2> | 43 <h2 id="setup">Setup</h2> |
44 <p>For this codelab, you will need to point your web browser at | 44 <p>For this codelab, you will need to point your web browser at |
45 the Beta preview of our in-browser NaCl Dev Environment.</p> | 45 the Beta preview of our in-browser NaCl Dev Environment.</p> |
46 <a href="https://naclports.storage.googleapis.com/builds/pepper_41/trunk-169-gc7
7aece/publish/devenv/pnacl/app/bash.html" | 46 <a href="https://naclports.storage.googleapis.com/builds/pepper_41/trunk-176-g9b
9e342/publish/devenv/pnacl/app/bash.html" |
47 target="_blank">Click here to open the environment.</a><p>While no installation
is needed, the first load of the page will | 47 target="_blank">Click here to open the environment.</a><p>While no installation
is needed, the first load of the page will |
48 require you to agree to allow the page unlimited storage | 48 require you to agree to allow the page unlimited storage |
49 (Click “Ok” in the bar at the top of your browser window.)</p> | 49 (Click “Ok” in the bar at the top of your browser window.)</p> |
50 <p>The first run requires a large download. Please be patient. | 50 <p>The first run requires a large download. Please be patient. |
51 Also, as PNaCl translates executables to native code on demand, | 51 Also, as PNaCl translates executables to native code on demand, |
52 each program will also have have a noticable load delay on first run. | 52 each program will also have have a noticable load delay on first run. |
53 We’re actively working to improve this.</p> | 53 We’re actively working to improve this.</p> |
54 <p>NOTE: This environment will leave a substantial (800MB) payload in your | 54 <p>NOTE: This environment will leave a substantial (800MB) payload in your |
55 browser. See the cleanup section below to learn how to recover this space.</p> | 55 browser. See the cleanup section below to learn how to recover this space.</p> |
56 <p>Once the download is complete you should see a bash prompt:</p> | 56 <p>Once the download is complete you should see a bash prompt:</p> |
(...skipping 127 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
184 Unfortunately, generating textual diffs is not one of them. | 184 Unfortunately, generating textual diffs is not one of them. |
185 Python on the other hand has the <a href="https://docs.python.org/2/library/diff
lib.html" | 185 Python on the other hand has the <a href="https://docs.python.org/2/library/diff
lib.html" |
186 target="_blank">difflib</a> module in its standard library.</p> | 186 target="_blank">difflib</a> module in its standard library.</p> |
187 <p>The starting point you’ve just extracted contains the shell | 187 <p>The starting point you’ve just extracted contains the shell |
188 of a web app using Portable Native Client Python to generate a diff. | 188 of a web app using Portable Native Client Python to generate a diff. |
189 Just one thing is missing, that whole diffing thing...</p> | 189 Just one thing is missing, that whole diffing thing...</p> |
190 <p>To see where things stand, deploy the sample like this:</p> | 190 <p>To see where things stand, deploy the sample like this:</p> |
191 <pre class="prettyprint"> | 191 <pre class="prettyprint"> |
192 make | 192 make |
193 </pre> | 193 </pre> |
194 <p>This will copy the sample to /tmp/differ (clobbering whatever is already | 194 <p>This will attempt to open the sample, but will be blocked by |
195 there). It will also attempt to open the sample, but will be blocked by | 195 a popup blocker the first time. Click on the URL to accept the popup. |
196 a popup blocker. Click on the URL to accept the popup.</p> | 196 It also clobbers /tmp/differ for good measure.</p> |
197 <p>As you can see, this isn’t quite what we’re going for.</p> | 197 <p>As you can see, this isn’t quite what we’re going for.</p> |
198 <p>You’ll want to modify diff.py, using the editor you selected earlier. | 198 <p>You’ll want to modify diff.py, using the editor you selected earlier. |
199 You’ll probably want to consult the <a href="https://docs.python.org/2/lib
rary/difflib.html" | 199 You’ll probably want to consult the <a href="https://docs.python.org/2/lib
rary/difflib.html" |
200 target="_blank">difflib</a> documentation. | 200 target="_blank">difflib</a> documentation. |
201 I would suggest you check out the HtmlDiff class and make use of | 201 I would suggest you check out the HtmlDiff class and make use of |
202 the make_file member function. I would also suggest the splitlines | 202 the make_file member function. Note our goal is to create a |
| 203 full HTML diff, so the make_table function is insufficient. |
| 204 I would also suggest the splitlines |
203 function may come in handy.</p> | 205 function may come in handy.</p> |
204 <p>You can test diff.py manually as you would in a normal UNIX environment. | 206 <p>You can test diff.py manually as you would in a normal UNIX environment. |
205 It can be run like this:</p> | 207 It can be run like this:</p> |
206 <pre class="prettyprint"> | 208 <pre class="prettyprint"> |
207 ./diff.py before.txt after.txt out.html | 209 ./diff.py before.txt after.txt out.html |
208 </pre> | 210 </pre> |
209 <p>Once everything is working diff.html will contain an html diff. | 211 <p>Once everything is working diff.html will contain an html diff. |
210 Run <cite>make</cite> again to deploy and test the full app.</p> | 212 After the initial <cite>make</cite> you can hit “Run” to test your c
hanges.</p> |
211 <p>Now get to it, and good luck!</p> | 213 <p>Now get to it, and good luck!</p> |
212 <h2 id="what-you-ve-learned">What you’ve learned</h2> | 214 <h2 id="what-you-ve-learned">What you’ve learned</h2> |
213 <p>While the details of building and packaging Python have been | 215 <p>While the details of building and packaging Python have been |
214 insulated from you for the purpose of this exercise, the key take-home lesson | 216 insulated from you for the purpose of this exercise, the key take-home lesson |
215 is how easy it is to leverage Python using PNaCl. | 217 is how easy it is to leverage Python using PNaCl. |
216 As you’ve likely experienced, the initial start time is non-trivial. | 218 As you’ve likely experienced, the initial start time is non-trivial. |
217 We’re working on improving this, both by improving PNaCl, | 219 We’re working on improving this, both by improving PNaCl, |
218 and our Python port.</p> | 220 and our Python port.</p> |
219 <p>The same approach to deploying Python apps can be used for the other | 221 <p>The same approach to deploying Python apps can be used for the other |
220 interpreted languages that have been ported to PNaCl.</p> | 222 interpreted languages that have been ported to PNaCl.</p> |
(...skipping 10 matching lines...) Expand all Loading... |
231 <p>The Web-based version of the Chrome Dev Environment installs | 233 <p>The Web-based version of the Chrome Dev Environment installs |
232 package data (>800MB) into the HTML5 Filesystem storage associated | 234 package data (>800MB) into the HTML5 Filesystem storage associated |
233 with naclports.storage.googleapis.com . | 235 with naclports.storage.googleapis.com . |
234 To recover this storage (i.e. uninstall), | 236 To recover this storage (i.e. uninstall), |
235 enter <strong>chrome://settings/cookies</strong> in the Chrome URL bar. | 237 enter <strong>chrome://settings/cookies</strong> in the Chrome URL bar. |
236 In the cookies UI, search for “naclports”. | 238 In the cookies UI, search for “naclports”. |
237 Then click the “x” next to the naclports entry.</p> | 239 Then click the “x” next to the naclports entry.</p> |
238 </section> | 240 </section> |
239 | 241 |
240 {{/partials.standard_nacl_article}} | 242 {{/partials.standard_nacl_article}} |
OLD | NEW |