Tea Free Stack
Siarhei Niaprakhin
Social: @MadaShindeInal
1
2
src/some-file-name.js
3
Agenda:
Episode 0: The Force Awakens
Episode 1: The Phantom Menace
Episode 2: Attack of the Clones
Episode 3: New Hope
Episode 4: The Empire Strikes Back
Episode 5: Revenge of the Sith
Episode 6: The Last Jedi
Notes:
0: Take code examples as illustrations
1: All the links are presented as QR codes
2: Screenshot reading instead of live coding
4
Episode 0:
The Force Awakens
HTML+CSS
website example:
5
Virtual keyboard created with HTML, CSS and JS
6
A pixel-by-pixel drawing application with the ability to create animations. Created with HTML, CSS, JS, Canvas
7
Tower defence browser game
8
NiceAdvice - legal advice SaaS company from Poland.
9
Episode 1: The Phantom Menace
10
Link to the old react documentation
11
Link to article
12
13
Link to the new React docs
14
15
Class
HOCs
Hooks
RSC
16
Recompose
React-apollo
17
CSS-IN-JS issues overview
18
Episode 2:
Attack of the Clones
NPM trends link:
19
Link to a tweet:
20
21
Episode 3: New Hope
22
NextJS website:
Another NPM trends link:
23
Link to the current React docs page
24
Episode 4:
The Empire Strikes Back
T3 app website and docs:
25
26
27
28
You can find more about tRPC there
29
30
31
32
33
34
35
We use ~ as root. @ (at) is another popular option.
36
Note: Everything is optional except NextJS and Typescript.
37
38
39
40
41
42
43
44
Gist about tRPC
45
46
47
48
49
Autobatching out of a box
50
51
Build time fetch
Just access to data
52
Episode 5:
Revenge of the Sith
T3-turbo repo:
53
54
55
56
Episode 6:
The Last Jedi
tRPC drift:
57
58
59
60
61
62
1. Is that T3-app production ready?
2. Is that T3-app fast?
3. NextJS + lambdas means no websocket?
Top-3 questions usually asked about things I shared today:
63
Useful links:
The best online service
for paid legal advice in Poland (created with T3-stack)
tRPC:
T3-app:
T3-turbo:
T3-env:
tRPC Drift:
My Twitter:
Tea Free Stack
By Siarhei Niaprakhin