PoSo's Note

【テンプレ有り】コマンド1つで爆速なブログサイトを自作する方法を解説

プログラミング
想定ニーズ
  • 自作ブログの作り方を知りたい
  • プログラミング知識そこまでないけど大丈夫かな
  • 実際の運用コストってどうなんだろう(サーバー、SEO)

こういった疑問に答えます。

はじめまして、PoSoと言います。
エンジニアは今年が1年目のまだまだひよっこです。

そんな僕ですが、今回自身のブログサイトを自作するに至りました。
今回は自作ブログの作り方を、何回かに渡って解説します。
僕でもできたので、少しプログラミングができれば、誰でも再現可能だと思います。

事前知識は程々で大丈夫です

今回使用している技術は、

  • フロントエンド:Nuxt.js
  • データソース:microCMS
  • サーバー(ホスティング):Netlify


ざっくりこんな構成です。

以上から考えられる必要な事前知識としては、

必要そうな知識
  • HTML
  • CSS
  • JavaScript
  • Vue.js
  • Nuxt.js
  • Git

こんなところでしょうか。
どれも程々でOKです。

この記事では、この辺りの知識のない人でも"頑張ったら"作れる、を目標に作成しています。
できるだけ親切に、わかりやすく作っていますので頑張ってみてください。

自作ブログの作り方を解説します

※解説の前に
僕はWindowsで開発環境を構築しています。
この記事では一貫してWindows環境に絞って解説を行います。

簡単にですが、流れはこんな感じ。

制作の流れ
  1. 開発環境を構築 ←今回はこの部分まで!
  2. Githubリポジトリをクローン
  3. microCMSでプロジェクト、API作成
  4. 機能やレイアウトを好きなように調整
  5. Netlifyでホスティング

1. 開発環境を構築

早速はじめていきましょう!
https://posonote.com/programming-is-general-education/

export default {
  asyncData(context) {
    context.app.$hoge()
  }
}

これは見出し3です


これは見出し4です


これは見出し5です

ABOUT ME

PoSo
フロントエンド好き / ゲーマーエンジニア / vue.js / nuxt.js / Jamstack / TypeScript / JavaScript / Node.js