Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Speaker Deck
PRO
Sign in
Sign up for free
Deno Node 両刀
Koutarou Chikuba
March 17, 2022
5
1.8k
Deno Node 両刀
Node 学園 #38
Koutarou Chikuba
March 17, 2022
Tweet
Share
More Decks by Koutarou Chikuba
See All by Koutarou Chikuba
V8 as a container on CDN Edge worker
mizchi
5
1.2k
Edge Side Frontend という新領域
mizchi
28
12k
バンドル最適化マニアクス at tfconf
mizchi
6
3k
「たかがJavaScript」のその先 #TECHPLAY
mizchi
46
19k
「フロントエンド領域」を再定義する
mizchi
50
33k
光を超えるためのフロントエンドアーキテクチャ
mizchi
82
20k
ServiceWorkerSideReactServerSideRendering
mizchi
5
740
Development Tools for Next Generation
mizchi
16
1.4k
加速するフロントエンドとPWA
mizchi
56
15k
Featured
See All Featured
Robots, Beer and Maslow
schacon
154
7.3k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
152
13k
Unsuck your backbone
ammeep
659
56k
Rails Girls Zürich Keynote
gr2m
87
12k
The MySQL Ecosystem @ GitHub 2015
samlambert
240
11k
Docker and Python
trallard
30
1.9k
Building a Modern Day E-commerce SEO Strategy
aleyda
6
4.5k
How to Ace a Technical Interview
jacobian
270
21k
Bash Introduction
62gerente
601
210k
Into the Great Unknown - MozCon
thekraken
2
270
A Tale of Four Properties
chriscoyier
149
21k
Statistics for Hackers
jakevdp
784
210k
Transcript
Deno Node ྆ ͍͖ͬͯ @mizchi | PLAID Inc. NodeֶԂ 38࣌ݶ
Deno ͍͍ΑͶ… ͍·͙͢ curl -fsSL https://deno.land/install.sh | sh
Deno ͍͍ΑͶ… • ࣄલ install ෆཁ: εχϖοτ͕ಈ͘อূ͕ͱΓ͍͢ • => node+ts
࣮ߦڥ͕ࣗ໌Ͱͳ͍ • ΤίγεςϜ͕ TS ܾΊଧͪ • ΈࠐΈ lint | fmt | test ͷମݧͷྑ͞ • => node eslint+typescript+prettier ڥͷߏங͕ͩΔ͍ • Deno ຊମͷίʔυ͕ಡΈ͍͢ • Rust Ͱ tokio + rusty-v8(v8 Binding)
node: ͜ΕͲ͏ͬͯಈ͘ͷʁ // native esm ͔ɺ comnonjs ܦ༝͔ෆ໌ import foo
from "foo"; // module.exports? export default? import { xxx } from "@/x"; // ͩΕ͕͜ͷύεΛղܾ͢Δʁ; // ڥมͳͷ͔ɺόϯυϥʹ replace ͞ΕΔͷ͔ console.log(process.env.NODE_ENV);
Deno (ͷར༻ऀ)ͷ՝ • طଘࢿ࢈ͷར༻ • طଘͷͷ Node ༻ͩ͠… • ҆શੑ͕આ໌Ͱ͖Δ͔
• ಈతͳωοτϫʔΫ૬खʹґଘղܾ͢Δෆ҆ • ։ൃମݧ • vscode ͕ͪΌΜͱରԠͯ͘͠Εͳ͍ͱ͑ͳ͍ΑͶ
ࣗͷࢥ͏ Deno ࠾༻ͷ͠͞ • 1. ࠜຊతʹґଘղܾϙϦγʔ͕ҧ͏ • 2. ࠜຊతʹඪ४ϥΠϒϥϦ͕ҧ͏ •
3. vscode-deno ͕ඪ४ͷ (Microsoft) TypeScript ͱഉଞؔ
ཁҧ͍Λཧղͯͤ͠Α͍ʂʂ • Node ͱ Deno ͷϙϦγʔΛཧղ͢Δ • ཧղͨ͠ΒదͳղܾࡦΛऔΕΔ • ղܾࡦΛఏࣔͨ͠Β࠾༻ΛωΰΕΔ
ཧղ͢Δͧʂʂʂ
ܗ͔ΒೖΔ Deno • node Ͱ lint ͱ fmt ͚ͩआ༻͠Α͏ͥʂ •
ࢀߟ: node ϓϩδΣΫτͰ deno lint | deno fmt ͢Δ https:// zenn.dev/mizchi/articles/just-lint-by-deno • deno.jsonc Λஔ͘ $ deno fmt $ deno lint eslint+typescript+prettier ૬
ґଘղܾ: Ϟδϡʔϧ Deno ωοτϫʔΫܦ༝ͰґଘΛղܾ͢Δ // node: npm install zod --save
import { z } from "zod"; // deno import { z } from "https://deno.land/x/
[email protected]
/mod.ts";
ґଘղܾ: ϩʔΧϧ ֦ுࢠ/σΟϨΫτϦͷলུෆՄ // node + tsc import { foo
} from "./foo"; import { bar } from "./bar"; // deno import { foo } from "./foo.ts"; import { bar } from "./bar/index.ts"; ※ node Ͱ Native ESM ͷͱ͖ɺdeno ͱಉ֦͘͡ுࢠলུෆՄ
Deno ͕ Node ޓͰͳ͍ཧ༝ • ry ʮDeno ͷ࣮ߦݖݶ༩ͱηοτͳͷͰɺ৴པͰ͖ͳ͍ωοτϫʔ Ϋ͔ΒґଘΛղܾͯ͠ͳ͍ʯ (ޙड़)
• ֦ுࢠͷলུෆՄ RTT ΛݮΒͨ͢Ίʹඞཁ • node: ./foo => foo/package.json#main, foo/index{.*}, foo{.*} • ͦͦ ESM ͷ༷ʹύεͷ࣮ମղܾϧʔϧఆٛ͞Εͯͳ͍ • ϒϥβ্ͷ ESM Ͱجຊతʹ֦ுࢠলུෆՄ(※ઃఆʹΑΔ)
First Step: ؾ͚࣋ͪͩ Deno • Rust crate ෩: mod.rs Ͱ֎ʹ
export • deps.ts Ͱ֎෦ϞδϡʔϧΛ import // mylib/deps.ts export { z } from "https://deno.land/x/
[email protected]
/mod.ts"; // mylib/mod.ts import { z } from "./deps.ts"; export const version: number = 1; export function validate(input: any) { return z.string().safeParse(input) }; (งғؾΛ͍ͬͯΕޙͰೃછΈ͍͢ɺؾ͕͢Δ…) • ۃɺ֎෦ import Deno.* Θͳ͍୯ମϑΝΠϧ྆༻Մ
Deno ͷηΩϡϦςΟ • --allow-env=<allow-env> • --allow-hrtime • --allow-net=<allow-net> • --allow-read=<allow-read>
• --allow-write=<allow-write> • --allow-ffi • --allow-run=<allow-run>: • -A, --allow-all
Deno ͷηΩϡϦςΟ: ਅ໘ʹॻ͘ deno deploy ͷ CLI Πϯετʔϧͷྫ $ deno
install \ --allow-read \ --allow-write \ --allow-env \ --allow-net \ --allow-run \ --no-check -r -f https://deno.land/x/deploy/deployctl.ts
Deno ͷηΩϡϦςΟ: ͖ͯ͜͏ͳΔ # શ෦ڐՄ $ deno run -A build.ts
# velociraptor (task runner) ͷ install ྫ $ deno install -qAn vr https://deno.land/x/
[email protected]
/cli.ts
Ӵࡦ: ಈతURLΛݕ • αϓϥΠνΣʔϯΞλοΫͰಈత URL ߈ܸର • https://deno.land/std/http/server.ts • =>
https://deno.land/
[email protected]
/http/server.ts • ࠓޙ҆શͳ URL ͔୭͕ݴ͑Δͷ͔ʁ • nest.land: ϒϩοΫνΣʔϯ্ͷύʔϚωϯτͳ URL ʹσϓϩΠ • deno vendor (v1.19): node_modules ͱಉ͡Α͏ʹϩʔΧϧʹݻΊͯ ͔Β࣮ߦ
Ӵࡦ: deno task --unstable (v1.20) • deno task(Deno): λεΫϥϯφʔͰݖݶΛΈͬͪΓॻ͘ {
"tasks": { "hello": "deno run --allow-read hello.ts" } }
ηΩϡϦςΟ·ͱΊ • ҆શدΓʹ͢ͳΒ nest.land deno.land ͷόʔδϣϯ͖URLͷΈ ৴པ͢Δ • αϘͬͯ
-A ͯ͠͠·͏ͷΛ͙ΈΛ࡞Βͳ͍ͱݖݶཧ͕ҙຯͳ ͍
૬ޓӡ༻Λߟ͑Δ • Deno => Node • Node => Deno
Deno ͔Β npm ΛݺͿ: CDN • ୯ମϑΝΠϧ(όϯυϧࡁΈ)ͳΒޓ • CDN ͕
X-Typescript-Types Λฦ͍ͯ͠Εɺ.d.ts Λ͔ͦ͜Βղ ܾ • package.json ͷ types Λ͏ • skypack.dev esm.sh ͕ରԠ // ͜Ε͕ܕͰ͑Δ import React from "https://cdn.esm.sh/
[email protected]
";
deno ͔Β node ΛݺͿ: deno --compat https://deno.land/
[email protected]
/node import { createRequire
} from "https://deno.land/
[email protected]
/node/module.ts"; const require = createRequire(import.meta.url); const path = require("path"); $ deno run --compat --unstable --allow-read deno-compat.ts • https://deno.land/std/node ʹޓϨΠϠʔͷ࣮͕͋Δ • ͋Μ·Γಈ͍ͯͳ͍
node ͔Β deno ݺͿ: dnt • https://github.com/denoland/dnt • ࢀߟ: deno
to node ͷ dnt ࢼ͢ https://zenn.dev/mizchi/scraps/ a37ea7c793094f // ͜͏͍͏ίʔυΛల։ export { delay } from "https://deno.land/x/
[email protected]
/mod.ts"; • https://...ͷ ϞδϡʔϧΛϩʔΧϧʹղܾ • Deno Λ node ༻ʹม => import { Deno } from "@deno/shim- deno";
dnt ʹΑΔల։ྫ npm/ !"" LICENSE !"" README.md !"" esm #
!"" deps # # $"" deno_land_x # # $"" delay_v0.2.0 # # !"" mod.js # # $"" src # # $"" delay.js
dnt ͑Δ͔ʁ • denoland ެࣜͳͷخ͍͕͠… • ਖ਼ node Ͱॻ͍ͯόϯυϧͯ͠͏ͷָ͕ •
(ϑϩϯτΤϯυతʹ) ॏෳίϯτϩʔϧͱ͔Ͱ͖ͳͦ͞͏
Node Λ Deno ͬΆ͘ಈ͔͢ $ node --experimental-network-imports code.js Node ͷ
Deno ෩ network-import (experimental) https://nodejs.org/api/esm.html#https-and-http-imports // file.mjs import worker_threads from 'worker_threads'; import { configure, resize } from 'https://example.com/imagelib.mjs'; configure({ worker_threads });
։ൃڥʹ͍ͭͯ
VSCode • vscode_deno ΛΠϯετʔϧͯ͠࠶ىಈ https://github.com/ denoland/vscode_deno • Shift+Command+P ͰҎԼͷίϚϯυΛ࣮ߦ •
Deno: Initialize Workspace Configuration • Deno: Cache Dependencies // .vscode/settings.json { "deno.enabled": true }
vscode_deno Կ͕ى͜Δ͔ • typescript ͷ lsp Λୣͬͯ deno ༻ʹࠩ͠ସ͑Δ •
node ༻ͷͷٯʹյΕΔ
vscode: Node Deno ڞଘ ## ௨ৗͷ Node .vscode/settings.json # "deno.enabled":
false ## ͚ͩ͜͜ Deno deno/ .vscode/settings.json # "deno.enabled": true code . code deno --add ※ʹΑͬͯಈ͍ͨΓಈ͔ͳ͔ͬͨΓ͠·͢
͕ࣗࢥ͏ Deno ͷݱ࣌ͷϢʔεέʔε • ॻ͖ࣺͯͷ CLI (εχϖοτ࣮ߦՄೳੑ͕ߴ͍) • ϏϧυπʔϧνΣΠϯ •
Rust ࿈ܞ෦ • αʔόʔӡ༻͍͚͠Ͳ deno deploy ͳΒϑϧϚωʔδυͰ͋Γ
͓ΘΓ ·ͱΊͰ lint ͋ͨΓ͔Βજ·͍͖ͤͯͬͯ·͠ΐ͏ʂ