こんにちは。NE株式会社（エヌイーと読みます）で働いている、よへいです。
弊社はHameeグループの共通ミッション「クリエイティブ魂に火をつける」を成し遂げるために、2022年5月にHamee株式会社より分社化し設立しました。
分社化後に、我々の存在位置「パーパス」と価値観「バリューズ」を制定したので、もしご興味のある方はこちらの記事を見ていただけると嬉しいです！
コーポレートサイトのリニューアル
会社設立からしばらくはNotionをベースとしたコーポレートサイトを公開していたのですが、「パーパス」と「バリューズ」を制定したことで、我々の世界観を体現できる用にリニューアルしました。
リニューアル後のサイトがこちら↓
リニューアル前の課題と改善したい要件のまとめ
リニューアル前がNotionベースだったこともあり、表現に制限がある一方で、更新はしやすいなど良いところと改善したい点がいくつかありましたので、技術選定をするにあたり以下のようにまとめました。
- デザイナーが直接テーマ等更新でき、クリエイティブに制約がないこと
- 表現を自由にコントロールできること
- 静的なサイトであること
- 更新頻度はそれほど高くなく、ログインなどもない
- 記事やお知らせなど非開発者が投稿・更新などできること
- 好きなタイミングで入稿・編集等ができること
- GitHubで管理でき、ブランチごとのプレビューが利用できること
- 継続的なアップデートや、改善をする上でとても大事
上記を踏まえて、所謂Jamstackと呼ばれる構成をとることにしました。
現時点では動的な箇所はありませんので、SSG（Static Site Generation）で、ビルド時に静的なページを生成し、配信サーバへ配置する方式を選択しています。
技術スタック
リニューアルにあたり主に以下のツールやサービスを利用しました。
- Astro
- Newt
- Vercel
それぞれ簡単に説明します。
Astro
選定理由は、
- コーポレートサイトはほぼ静的である
- 非エンジニアでも学習コストが低く利用できる
- Astroのコンセプトが今回のサイト構築にマッチしてると考えた
社内のデザイナー陣は初めてAstroを利用する際にもそこまで悩まずに実装に入れていました。
よりリッチな実装が必要になった際にはReactやVueなどのコンポーネントも利用できる柔軟性もとても良い点だと感じています。
あと公式のキャラ？がかわいい
Astro公式のwallpapersより
Newt
国産のヘッドレスCMSである「Newt」を利用しています。
記事データや、お知らせなどCMSで管理したいところがあるためヘッドレスCMSを採用しました。
選定理由は非開発者にも使いやすいUI、開発者にとってもわかりやすいAPI、あとは個人的にNewtさんのこの記事を読んでプロダクトにかける情熱を応援したい気持ちになった点があります。
Vercel
- GitHubとの連携が用意されていて、プレビューURL、本番デプロイが簡単な設定で実現できる
- 日本（ap-northeast-1）のリージョンがある
- 社内で実績がある
元々社内で実績があったことと、機能的にも不足がないためVercelを利用しています。
使いこなすというよりは、SSGのビルド＆デプロイ先として便利につかっている程度です。
終わりに
Astro + Newt + Vercelの構成はインフラ側悩むことほぼなく、サクッと作れるのでちょっとしたキャンペーンサイト作ったりにも相性が良いと感じました。
VercelのプレビューURLだったりは他のサービスでも実現できるので、要件に合わせて選択すると良いと思いますが、非開発者のステークホルダーと一緒に運用する場合にプレビューURLが利用できることはとてもメリットが大きいのでオススメです。
現時点では最小構成でのサイトとなっており、現在も引き続きページの追加や改修が続いています。
Astroの機能追加もどんどんされていってるので楽しみは尽きませんねー！
NE株式会社のエンジニアを中心に更新していくPublicationです。 NEでは、「コマースに熱狂を。」をパーパスに掲げ、ECやその周辺領域の事業に取り組んでいます。 Homepage: ne-inc.jp/
Discussion