フロントエンドの地獄
cover image
page icon

Notionで書いた内容がそのままWebサイトになるサービス #Anotion を作りました!

Date
2020/10/21
Tags
技術
個人開発
作ったもの
みなさんこんにちは@nabettuです
 
先日ツイートしましたが、ここんとこずっと作っていたAnotionというWebサービスをローンチしました🎉

何ができるサービス?

Notionで書いた内容がそのままWebサイトになるサービスです。ユーザーがログインして公開されている自分のNotionの記事を指定するだけで、リアルタイムに編集した内容がそのままWebサイトになります!
 
 
なななんと!このブログ(nabettu.com)もそのAnotionで動いており、Notionのシェアページと違う点としては
  1. デザインもオリジナルのCSSで自由にカスタマイズ可能
  1. 記事ごとのパーマリンク(URL)の設定
  1. 独自ドメインの設定が可能
  1. GAが設置できて
  1. ヘッダーフッターを置く
などなどがあります!
 

でも、お高いんでしょう?

そうなんです。あまり安くはなくてすいません🙏
一ヶ月はトライアルとして無料で利用出来ますが、その後ははてなブログやペライチ等と同じ価格帯の月980円になります!
逆にブログやWebサイトのホスティングサービスとしては普通の値段です!
 

Anotionのめざすところ

私の人生のスローガンは 「ものづくりの楽しさをすべての人に」 です。ものづくり、楽しくないですか?私は大好きで、今後も一生なにかを作りながら生きていくと思っています。
 
そんな私が今まで作ってきたものはブログを書く際にアプリ紹介を楽にできるようにしたアプリーチというツールや、
 
色々なジャンルで創作をする人がフォント選びで手間をなくすためのためしがき
 
などなど、、、「発信をする人が楽になる」とか「ものづくりで困るポイントを減らす」ためのサービスを作ってきました。
(もちろん自分が面白いから作ったものもたくさんありますがw)
 
Notionというツールは文書を書きつつ、リンクを貼ったり画像を入れたり、リッチなテキストを書く上で非常に書きやすいツールです。
このツールと自分のサービス(Anotion)を組み合わせることで「発信までのハードルがとにかく低いブログサービス」「ドキュメントの編集から公開までのステップがとにかく楽」なサービスを提供していきたいと思っています。
 
私自身も今まで色々なブログサービスや自作ブログサービスを使って来ましたが、今の所公開までのステップが最も短く、カスタマイズ性もそこそこあり、スマホからも編集しやすい組み合わせになっていると思います。
 
ブログ以外にも、Webサービスなどのドキュメントなどに使えるサービスとなっています。こちらはプロフカードというサービスのよくある質問ページにAnotionを利用頂いています。
 
Anotionを使えば、こういったドキュメントページを自分でHTMLを書いてGitにPushしてデプロイして、、、というステップを飛ばして公開できます。そして自分のサービスのトーンに合わせて色味を調整する、サービスのサブドメインに配置する、などが可能になります。
 
このサービスを通じて「ものを作る人達が文章を公開することを楽にして、自分のものづくりに集中」していってもらえたら嬉しいと思って作っています。
 

サービスの今後の展望

  • 表示できるNotionのコンテンツを増やす(今はテーブルなどが表示できない)
  • サイト表示を早くする(SEO!)
  • デザインカスタマイズについて、GUIでスタイルを当てられるようにする(これが出来たら胸を張ってNoCodeだ!と言える気がするw)
  • メディアとして展開できる機能(WordPressを倒すぞ!)
  • デザインからテーマを選択したら適用される
などなど、既存のNotionページのシェア機能をより良く拡張しつつ、メディアとして展開していけるサービスにしていければと思っています。
 

技術的な話

技術書典で出した #個人Webサービスシステム構成事典に書いた内容ですが、システム構成はこのような形になっております。
notion image
ざっくりと説明すると
  • フレームワークはNext.js
  • 管理画面にMusubii
  • ホスティングはVercel
  • ユーザー・データ管理はFirebase
  • 記事管理はNotionから
  • 課金機能はStripe
を利用していて、詳しくはこのページに書いています。

まとめ

以上、新しいサービスの紹介でした!
最後まで読んで頂きありがとうございます!
 
今後ももっといいサービスにしていきたいと思っていますので、もしよければお付き合いいただければと思います!