Svelteで何かデプロイしたい時には。
普段、バックエンドに引きこもっているデータエンジニアだが、たまにはフロントエンドに出ていってみようかと思い、最速JSに近しい存在という爆速（=>死語？）なSvelteいじって三日目。そろそろ（無料で）デプロイなるものをしてみたい今日このごろ。
...ということで、nodejs系を始めいろいろと無料でお気楽にデプロイできそうなZeit NOWを試してみた。
参考 Now でクラウドの複雑さから解放されよう、今すぐに
github(かgitlabなど)の個人アカウントを持っているならば、たしかに、すぐさまデプロイできたのでメモを残しておく。Zeit now初体験だったが、１０分ほどでデプロイをできた。
デプロイしたもの（カス）:
アクセス先:
https://svelte1.now.sh
・・・デプロイしたものは、Svelteの公式チュートリアルの一部を改悪しただけのカス。
SvelteをNOWにデプロイする手法(2020年版)
① NOW用Svelteをfolk
『zeit svelte』でググると出てくる以下から、
https://zeit.co/guides/deploying-svelte-with-zeit-now
自分が使っているgitリポジトリのアカウントを選ぶだけ。githubの場合
https://zeit.co/import/git?tab=github
あとは、SSOの認証を行うとディフォルトでprivateリポジトリにfolkしてくれる。
公開すると恥ずかしいサービスを作りたいとか、一山当てたいサービスを作りたい際には、privateリポジトリがディフォルトなのはありがたい限り。
② NOW用Svelteをcloneして編集
folkたら当然、git cloneの類を持ってきて編集することになる。
フォルダ構成は以下の通り。ほぼSvelteのフォルダ構成通りだが.nowフォルダ配下がZeit NOWとの周りの調整を担ってくれているらしい。
とりあえず、お試ししたい場合は、↑のApp.svelteを編集する。今回の場合。
<script>
let count = 1
$: doubled = count * 2
$: tripled = count * 3
let handleClick = () =>{
count = tripled+3
}
</script>
<style>
p {
color: purple;
font-family: 'Comic Sans MS', cursive;
font-size: 2em;
}
</style>
<main>
<h1>滑る手おぢさん（仮）。</h1>
<h2>
<a href="https://zeit.co/docs" target="_blank" rel="noreferrer noopener">
ZEIT Now
</a>
でSvelteしてみる。突然だが、おい、オマイラ、掛け算という奴をしてみないか。すごく大きくなるぞ。
</h2>
<br />
<p>元の数{count} しかして、け奴の×２は、 {doubled} 然らば、×３ {tripled}。けだし大きな数なり。</p>
<button on:click={handleClick}>
クリックしてみて 。 只今の元の数:{count}
</button>
</main>
③ デプロイ
node/npm入っている人ならば、ひとまず、npm i -g nowした後に、メール認証などを済ませた後は、
編集しているフォルダにて、
now --prod
するだけで、git add/git commit / git push、そしてNOWを介して本番デプロイという手順を一気に済ませられる。
セキュリティ云々を考えないなら、ほんとにお気軽。
終わりに
少なくとも個人開発でのnodejsでの開発工程ならば、Zeit NOWは現時点では文句なしの存在ということを確認した。Svelteのバックエンドは数十分で始めた、Svelte+Firebaseのアプリ生活。で、firebaseが良さげと分かっている。
フロントエンド素人として悩ましいのが、node上でSvelteを動かす方法。絶賛開発中のSapperを試してはみたが、（英語でも）文書がなさすぎて素人にはつらすぎる（セキュリティ云々を気にするとfirebaseをバックエンドにしたアプリを公開できるは先になりそう、、）。
どなたかSvelte/Sapperのベストプラクティスを紹介してくださらぬものかのぅ．（コーダー老人的堕ち）。とりあえず、Svelteお試しする分には楽しいので良しとするが。