The goal in this article is to get the FrontEnd server start by using Aleph.js which is a React Framework for Deno. Aleph.js is inspired by Next.js.
You can read the official website, here in detail.
Editor
VSCode
Version Infomation
deno 1.6.3
module: aleph@v0.2.28
Installation
To install Aleph, just run the below command so that you can use aleph command on terminal console.
deno install --unstable -A -f -n aleph http://deno.land/x/aleph@v0.2.28/cli.ts
Then, if you want to have a quick start, just run aleph init on the terminal console. The sample project will be generated.
In my case, I wanted to make the root directory src so moved most of the codes under src directory after aleph init.
Note that you must locate public directory in the same layer of src directory, otherwise, the module inthere can not be read properly.
This is because Server Static files ./public/ is mapped to /. Here in detail.
More directory examples are here.
After this, modify the import path in each file so as to import each module correctly by the client-side. However, without it, the server itself can be boot by aleph dev.
Start Server
Run aleph devand access http://localhost:8080 (port is probably 8080) so that you can see the Aleph sample page.
Check the source tree in Chrome dev tools.
From now, your turn
You just create whatever you would like to!
In terms of Routing, although the simple router works, however, Link Component does not work. (This could be only in my local.)
Here is the detail. In there, it is written about some aspects such as Link, Redirect, and useRouter. You see the next code there.
import { Link } from “https://deno.land/x/aleph/mod.ts";
But this link(precisely mod.ts module) actually does not exist any longer. So be careful.
If you have any information about this, please contact me. Thank you.
Other
To do auto format, install the deno extension in VSCode.
extensions.json
settings.json
import_map.json
Shift+Command+P and execute> Format Document!!