Skip to content

Commit 0aa70f8

Browse files
koxudaxikoxudaxi
authored
Merge pull request #7 from t-strings/add-try-it-now-page
Add try it now page
2 parents f89b741 + 4dd9761 commit 0aa70f8

File tree

4 files changed

+196
-0
lines changed

4 files changed

+196
-0
lines changed

‎public/index.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -81,6 +81,7 @@
8181
<nav class="text-xxs flex flex-row gap-x-4">
8282
<a href="/">home</a>
8383
<a href="/introduction.html">brief intro</a>
84+
<a href="/try-it-now-html.html">try it now</a>
8485
<a href="/playground.html">playground</a>
8586
</nav>
8687
<h1 class="font-serif font-bold text-cloudbank text-3xl">

‎public/introduction.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -111,6 +111,7 @@
111111
<nav class="text-xxs flex flex-row gap-x-4">
112112
<a href="/">home</a>
113113
<a href="/introduction.html">brief intro</a>
114+
<a href="/try-it-now-html.html">try it now</a>
114115
<a href="/playground.html">playground</a>
115116
</nav>
116117
<h1 class="font-serif font-bold text-cloudbank text-3xl">

‎public/playground.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -81,6 +81,7 @@
8181
<nav class="text-xxs flex flex-row gap-x-4">
8282
<a href="/">home</a>
8383
<a href="/introduction.html">brief intro</a>
84+
<a href="/try-it-now-html.html">try it now</a>
8485
<a href="/playground.html">playground</a>
8586
</nav>
8687
<h1 class="font-serif font-bold text-cloudbank text-3xl">

‎public/try-it-now-html.html

Lines changed: 193 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,193 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
<title>t-strings: Try it now!</title>
7+
<link rel="stylesheet" href="https://use.typekit.net/xls3jeb.css" />
8+
<script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>
9+
<style type="text/tailwindcss">
10+
@theme {
11+
--font-serif: "dolly-new", "serif";
12+
--font-sans: "auto-pro-new", "sans-serif";
13+
14+
--color-treeline: #0f1a2d;
15+
--color-light-treeline: #1a2c47;
16+
--color-foothills: #233d58;
17+
--color-cloudbank: #486280;
18+
--color-light-cloudbank: #66809e;
19+
--color-lighter-cloudbank: #849ebc;
20+
--color-sunset: #d19d4d;
21+
--color-sound: #466b96;
22+
--color-light-sound: #6489b4;
23+
--color-wash: #d2d3d5;
24+
--color-light-wash: #e0e1e3;
25+
--color-lightest-wash: #f0f1f3;
26+
}
27+
28+
html {
29+
font-size: 16pt;
30+
@apply md:text-[22pt];
31+
}
32+
33+
a {
34+
cursor: pointer;
35+
color: var(--color-cloudbank);
36+
text-decoration: underline;
37+
transition: color 0.2s;
38+
}
39+
40+
a:hover {
41+
color: var(--color-sunset);
42+
transition: color 0.2s;
43+
}
44+
45+
.text-xxs {
46+
font-size: 0.7em;
47+
}
48+
49+
nav > a {
50+
color: var(--color-gray-500);
51+
}
52+
53+
strong {
54+
color: #333;
55+
}
56+
57+
.team a {
58+
text-decoration: none;
59+
}
60+
61+
.team svg {
62+
fill: var(--color-cloudbank);
63+
height: 0.85em;
64+
display: inline-block;
65+
margin-left: 0.25em;
66+
vertical-align: baseline;
67+
transition: fill 0.2s;
68+
}
69+
70+
.team svg:hover {
71+
fill: var(--color-sunset);
72+
transition: fill 0.2s;
73+
}
74+
75+
code {
76+
font-size: 0.8em;
77+
background-color: var(--color-wash);
78+
padding-left: 0.1em;
79+
padding-right: 0.1em;
80+
border-radius: 0.25em;
81+
}
82+
83+
pre {
84+
max-width: 100%;
85+
overflow-x: auto;
86+
}
87+
88+
pre > code {
89+
font-size: 0.7em;
90+
@apply md:text-[0.6em];
91+
font-weight: normal;
92+
border-radius: 0.5em;
93+
padding: 0;
94+
white-space: pre;
95+
display: inline-block;
96+
min-width: 100%;
97+
}
98+
</style>
99+
<link
100+
rel="stylesheet"
101+
href="https://cdn.jsdelivr.net/gh/highlightjs/[email protected]/build/styles/github-dark.min.css"
102+
/>
103+
<script src="https://cdn.jsdelivr.net/gh/highlightjs/[email protected]/build/highlight.min.js"></script>
104+
<script src="https://cdn.jsdelivr.net/gh/highlightjs/[email protected]/build/languages/python.min.js"></script>
105+
<script src="https://cdn.jsdelivr.net/gh/highlightjs/[email protected]/build/languages/bash.min.js"></script>
106+
</head>
107+
<body>
108+
<div
109+
class="flex flex-col items-center min-h-screen bg-lightest-wash py-8 bg-light-cloudbank text-treeline"
110+
>
111+
<div class="mx-3 w-[95%] md:mx-auto md:max-w-sm pb-4 space-y-4">
112+
<nav class="text-xxs flex flex-row gap-x-4">
113+
<a href="/">home</a>
114+
<a href="/introduction.html">brief intro</a>
115+
<a href="/playground.html">playground</a>
116+
<a href="/try-it-now.html">try it now</a>
117+
</nav>
118+
<h1 class="font-serif font-bold text-cloudbank text-3xl">
119+
Try t-strings now!
120+
</h1>
121+
<p>
122+
Excited to try <strong>t-strings</strong> before Python 3.14's official release? You've got options!
123+
</p>
124+
125+
<h2 class="font-serif font-bold text-cloudbank text-xl mt-6">
126+
Option 1: Python 3.14.0b1
127+
</h2>
128+
<p>
129+
The simplest way to start experimenting with t-strings is to download and install the Python 3.14.0b1 beta release:
130+
</p>
131+
<p>
132+
<a href="https://www.python.org/downloads/release/python-3140b1/" target="_blank">Download Python 3.14.0b1</a>
133+
</p>
134+
<p>
135+
After installation, you can verify you have the right version and start experimenting:
136+
</p>
137+
<pre><code class="language-bash">$ python --version
138+
Python 3.14.0b1
139+
140+
$ python
141+
>>> name = "World"
142+
>>> t"Hello {name}!"
143+
Template(strings=('Hello ', '!'), interpolations=(Interpolation('World', 'name', None, ''),))
144+
</code></pre>
145+
146+
<h2 class="font-serif font-bold text-cloudbank text-xl mt-6">
147+
Option 2: Docker
148+
</h2>
149+
<p>
150+
Don't want to install anything on your system? Use Docker to spin up a Python 3.14 container:
151+
</p>
152+
<pre><code class="language-bash"># Pull the image
153+
$ docker pull python:3.14.0b1-bookworm
154+
155+
# Run an interactive Python shell
156+
$ docker run -it --rm python:3.14.0b1-bookworm python
157+
158+
>>> name = "World"
159+
>>> t"Hello {name}!" # Try t-strings!
160+
</code></pre>
161+
<p>
162+
You can also use the <code>3.14-rc-bookworm</code> tag which will always point to the latest release candidate.
163+
</p>
164+
165+
<h2 class="font-serif font-bold text-cloudbank text-xl mt-6">
166+
Option 3: Our Browser Playground
167+
</h2>
168+
<p>
169+
The easiest option of all! <strong>No installation required</strong> - just visit our <a href="/playground.html">Playground</a> to try t-strings directly in your browser.
170+
</p>
171+
<p>
172+
Our playground uses <a href="https://pyodide.org/" target="_blank">Pyodide</a> (with a 3.14.0b1 patch) and <a href="https://jupyterlite.readthedocs.io/en/latest/" target="_blank">JupyterLite</a> to run Python entirely in your browser. It's a great way to experiment without installing anything!
173+
</p>
174+
175+
<h2 class="font-serif font-bold text-cloudbank text-xl mt-6">
176+
What's Next?
177+
</h2>
178+
<p>
179+
Once you're up and running with Python 3.14, check out our <a href="/introduction.html">Brief Introduction</a> to understand what t-strings can do, or dive right into the <a href="https://github.com/davepeck/pep750-examples" target="_blank">examples repository</a> for inspiration.
180+
</p>
181+
<p>
182+
<strong>Feeling ambitious?</strong> Join us at our PyCon sprint today (Monday, May 19, Room 309, starting at 9AM) to help build the t-strings ecosystem!
183+
</p>
184+
<p>
185+
Happy template stringing!
186+
</p>
187+
</div>
188+
</div>
189+
<script>
190+
hljs.highlightAll();
191+
</script>
192+
</body>
193+
</html>

0 commit comments

Comments
 (0)