こんにちは。コルテクネのサーバーサイドエンジニアです。

今回は、弊社コーポレートサイトのリニューアルにリードエンジニアとして携わらせていただきましたので、簡単にご紹介したいと思います。

今回リニューアルするにあたって、既存のサイト(リニューアル前)とは違い、オウンドメディアとして、情報発信に強く、コルテクネの取り組みや業務、様子や魅力を発信し、ブランディング強化できるようなサイト作りを目的として、このプロジェクトがスタートしました。

以下、具体的な構成についてもご紹介していきます。

以下のように全てのコンテンツがドメイン直下の階層に配置される構造となっています。

これにより、記事一つ一つが独立したページであり、多種多様な全ての情報を上位のコンテンツとして発信する事を可能としています。また、検索からの流入も見込みやすくなるため、ユーザーのリーチにも効果的です。

図の通り、クライアントサイドは公開画面と管理画面がそれぞれ独立したアプリケーションとして構成されており、サーバーサイドとクライアントサイドの組み合わせは以下のようになっています。

公開画面: Rails(APIモード) + Nuxt.js
管理画面: Rails(APIモード) + Vue.js

いずれもサーバーサイドのフレームワークはRailsを使用しており、WebAPIサーバーとして実装しています。公開画面のクライアントサイドにはNuxt.jsを導入することで、サーバーサイドレンダリング(以下SSR)を可能にしました。
SSRを行うことによって、以下のようなメリットが挙げられます。

・ページの表示速度の向上やクローラーが正しくページ内容を評価でき、SEOに強いサイト作りができる。
・ユーザービリティの観点からも、ページがレンダリングされるまでに真っ白なページでユーザーを待たせることなく、コンテンツが描画された状態で迎えることができる。

企業の取り組みや魅力を発信する場でもあるコーポレートサイトにおいて、より多くの人に見ていただけるかどうかは非常に重要な要素となってきますので、より快適にアクセスができ、SEOにも強いサイトを実現すべく技術選定をいたしました。

Ruby、JavaScript、Ruby on Rails、Vue.js、Nuxt.js、FirebaseAuthentication、 AWS各種サービス

まだまだ改善点や反省点は数多く残っていますが、継続的に改善を行い、より良いコーポレートサイトにしていきたいと思います。
また、弊社の情報、技術ブログ、UI/UXデザインなどの様々な記事も続々掲載していきますので、是非ご覧いただけると幸いです。

以上、弊社コーポレートサイトのご紹介でした。

ARTICLES

TECHBLOG