はじめに
Deno+vnoをためしてみた（その２）を書こうと考えていたが、やりたいことができずに、少々はまってしまっているため、気分転換もかねて別のものをためしてみた。
Aleph
AlephはDenoで動かすことができるNext.jsインスパイアなフルスタックフレームワークとのこと。
ただ、バージョンがまだv0.3.0-beta.8なので、どこまで動くのかは不明である。
以前にどこかの記事でみた際はalpha版だったので、開発は進んでいると期待する。
では、vnoと同じように、サイトのGet Startedに従って動かしてみます。
Alephのインストール
- Denoのインストールは済んでいること。インストール方法などは前のブログ参照
- Denoのバージョンはある程度新しくないと動かないようです。
deno run -A https://deno.land/x/aleph/install.ts
- Denoのバージョンはある程度新しくないと動かないようです。
PS C:\Users\localuser> deno run -A https://deno.land/x/aleph/install.ts
Download https://deno.land/x/aleph/install.ts
Warning Implicitly using latest version (v0.3.0-beta.8) for https://deno.land/x/aleph/install.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/install.ts
Download https://deno.land/std@0.106.0/flags/mod.ts
Download https://deno.land/std@0.106.0/fmt/colors.ts
Download https://deno.land/std@0.106.0/path/mod.ts
Download https://deno.land/std@0.106.0/fs/exists.ts
Download https://deno.land/std@0.106.0/_util/assert.ts
Download https://deno.land/std@0.106.0/path/common.ts
Download https://deno.land/std@0.106.0/path/_interface.ts
Download https://deno.land/std@0.106.0/path/glob.ts
Download https://deno.land/std@0.106.0/path/win32.ts
Download https://deno.land/std@0.106.0/_util/os.ts
Download https://deno.land/std@0.106.0/path/posix.ts
Download https://deno.land/std@0.106.0/path/separator.ts
Download https://deno.land/std@0.106.0/path/_util.ts
Download https://deno.land/std@0.106.0/path/_constants.ts
Check https://deno.land/x/aleph/install.ts
Looking up latest version...
Download https://deno.land/x/aleph@v0.3.0-beta.8/cli.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/shared/log.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/shared/fs.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/shared/util.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/version.ts
Download https://deno.land/std@0.106.0/fs/ensure_dir.ts
Download https://deno.land/std@0.106.0/fs/_util.ts
Check https://deno.land/x/aleph@v0.3.0-beta.8/cli.ts
Aleph.js was installed successfully
Run 'aleph -h' to get startedコンソールの出力に従って、aleph -hを実行してみた。
PS C:\Users\localuser> aleph -h
Aleph.js v0.3.0-beta.8
The Full-stack Framework in Deno.
Docs: https://alephjs.org/docs
Bugs: https://github.com/alephjs/aleph.js/issues
Usage:
aleph <command> [...options]
Commands:
init Create a new app
dev Start the app in development mode
start Start the app in production mode
build Build the app to a static site (SSG)
analyze Analyze the app deps
upgrade Upgrade Aleph.js command
Options:
-v, --version Prints version number
-h, --help Prints help messageインストールは問題なさそうである。
Alephでプロジェクト作成
sampleという名前でプロジェクトを作ってみた。
PS D:\work\aleph> aleph init sample
Using VS Code? [y/n] y
Deploy to Vercel? [y/n] n
Downloading template. This might take a moment...
Apply template...
Cache deps...
Download https://deno.land/x/aleph@v0.3.0-beta.8/types.d.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/framework/core/mod.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/framework/core/redirect.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/framework/core/events.ts
Check https://deno.land/x/aleph@v0.3.0-beta.8/framework/core/mod.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/framework/react/mod.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/framework/react/components/Fallback.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/framework/react/hooks.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/framework/react/hoc.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/framework/react/context.ts
Download https://esm.sh/react@17.0.2
Download https://deno.land/x/aleph@v0.3.0-beta.8/framework/react/helper.ts
Download https://cdn.esm.sh/v46/react@17.0.2/deno/react.js
Download https://cdn.esm.sh/v46/@types/react@17.0.19/index.d.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/framework/react/renderer.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/framework/core/routing.ts
Download https://cdn.esm.sh/v46/object-assign@4.1.1/deno/object-assign.js
Download https://deno.land/x/aleph@v0.3.0-beta.8/framework/react/pageprops.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/framework/react/components/ErrorBoundary.ts
Download https://esm.sh/react-dom@17.0.2/server
Download https://deno.land/x/aleph@v0.3.0-beta.8/server/renderer.ts
Download https://cdn.esm.sh/v46/react-dom@17.0.2/deno/server.js
Download https://cdn.esm.sh/v46/@types/react-dom@17.0.2/server.d.ts
Download https://cdn.esm.sh/v46/@types/prop-types@15.7.4/index.d.ts
Download https://cdn.esm.sh/v46/@types/react@17.0.19/global.d.ts
Download https://cdn.esm.sh/v46/@types/scheduler@0.16.2/tracing.d.ts
Download https://cdn.esm.sh/v46/csstype@3.0.8/index.d.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/server/aleph.ts
Download https://deno.land/std@0.106.0/hash/mod.ts
Download https://deno.land/std@0.106.0/fs/walk.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/server/config.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/compiler/mod.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/plugins/css.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/framework/core/module.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/server/analyzer.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/server/helper.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/server/cache.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/server/mime.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/bundler/mod.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/compiler/dist/wasm.js
Download https://deno.land/x/aleph@v0.3.0-beta.8/compiler/dist/compiler.js
Download https://deno.land/x/aleph@v0.3.0-beta.8/compiler/dist/checksum.js
Download https://deno.land/std@0.106.0/hash/_wasm/hash.ts
Download https://deno.land/std@0.106.0/hash/hasher.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/bundler/esbuild.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/server/localproxy.ts
Download https://deno.land/std@0.106.0/hash/_wasm/wasm.js
Download https://deno.land/std@0.106.0/encoding/base64.ts
Download https://deno.land/std@0.106.0/encoding/hex.ts
Download https://deno.land/x/esbuild@v0.12.24/mod.js
Download https://deno.land/x/esbuild@v0.12.24/mod.d.ts
Download https://deno.land/x/brotli@v0.1.4/mod.ts
Download https://deno.land/x/brotli@v0.1.4/wasm.js
Download https://deno.land/x/lz4@v0.1.2/mod.ts
Download https://deno.land/x/lz4@v0.1.2/wasm.js
Check https://deno.land/x/aleph@v0.3.0-beta.8/framework/react/mod.ts
Download https://esm.sh/react-dom@17.0.2
Download https://cdn.esm.sh/v46/react-dom@17.0.2/deno/react-dom.js
Download https://cdn.esm.sh/v46/@types/react-dom@17.0.9/index.d.ts
Download https://cdn.esm.sh/v46/scheduler@0.20.2/deno/scheduler.js
Done
Aleph.js is ready to go!
▲ cd sample
▲ aleph dev # start the app in development mode
▲ aleph start # start the app in production mode
▲ aleph build # build the app to a static site (SSG)
Docs: https://alephjs.org/docs
Bugs: https://alephjs.org.com/alephjs/aleph.js/issues
sampleディレクトリが作られました。
api/
components/
lib/
pages/
public/
style/
.gitignore
app.tsx
import_map.json
vercel.jsonプロジェクトを起動
vnoと同じように開発モードと本番モードで起動を切り分けられる模様なので、開発モードで起動を試してみる。
PS D:\work\aleph\sample> aleph dev
Check https://deno.land/x/aleph@v0.3.0-beta.8/cli.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/commands/dev.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/shared/flags.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/server/mod.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/server/server.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/server/oak.ts
Download https://deno.land/std@0.106.0/io/streams.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/server/response.ts
Check https://deno.land/x/aleph@v0.3.0-beta.8/commands/dev.ts
Download https://deno.land/x/aleph@v0.3.0-beta.8/framework/react/init.ts
Check https://deno.land/x/aleph@v0.3.0-beta.8/framework/react/init.ts
INFO Download https://esm.sh/react-refresh@0.10.0/runtime?dev
INFO Download https://cdn.esm.sh/v46/react-refresh@0.10.0/deno/runtime.development.js
INFO Download https://esm.sh/react@17.0.2?dev
INFO Download https://esm.sh/react-dom@17.0.2/server?dev
INFO Download https://cdn.esm.sh/v45/react@17.0.2/deno/react.development.js
INFO Download https://cdn.esm.sh/v45/react-dom@17.0.2/deno/server.development.js
INFO Download https://cdn.esm.sh/v45/object-assign@4.1.1/deno/object-assign.development.js
INFO Download https://deno.land/x/aleph@v0.3.0-beta.8/framework/react/bootstrap.ts
INFO Download https://deno.land/x/aleph@v0.3.0-beta.8/framework/core/hmr.ts
INFO Download https://deno.land/x/aleph@v0.3.0-beta.8/framework/core/nomodule.ts
INFO Download https://deno.land/x/aleph@v0.3.0-beta.8/framework/react/components/Head.ts
INFO Download https://esm.sh/react-dom@17.0.2?dev
INFO Download https://deno.land/x/aleph@v0.3.0-beta.8/framework/react/pagedata.ts
INFO Download https://deno.land/x/aleph@v0.3.0-beta.8/framework/react/components/Router.ts
INFO Download https://cdn.esm.sh/v45/react-dom@17.0.2/deno/react-dom.development.js
INFO Download https://deno.land/x/aleph@v0.3.0-beta.8/framework/react/components/InlineStyle.ts
INFO Download https://deno.land/x/aleph@v0.3.0-beta.8/framework/react/components/CustomScript.ts
INFO Download https://deno.land/x/aleph@v0.3.0-beta.8/framework/react/components/StyleLink.ts
INFO Download https://deno.land/x/aleph@v0.3.0-beta.8/framework/core/style.ts
INFO Download https://cdn.esm.sh/v45/scheduler@0.20.2/deno/scheduler.development.js
INFO Download https://cdn.esm.sh/v45/scheduler@0.20.2/deno/tracing.development.js
INFO Start watching code changes...
INFO Server ready on http://localhost:8080/vnoの際も思ったが、サンプルで小さいといえど起動が早い。
お試ししてみて
vnoと同じく、インストールして起動しただけだが、特に問題なく画面の表示まで簡単にできている。こちらも時間を見つけてちょこちょこいじってみようと思います。