スマレジエンジニアyushiのブログ

スマレジエンジニアのブログ

【プロフィールページ改修 第2回】プロジェクト作成

引き続き、プロフィールページを作成していきます。

yushi-dev.hatenablog.com

技術スタックは下記の通りです。

  • nuxt.js
  • SCSS
  • Tailwind CSS

node.jsのバージョン

node.jsは、Maintenance LTSのv14を採用します。

Releases | Node.js

最新のv16も試してみたのですが、sassが導入時に必要なfibersが対応しておらず、断念しました。

fibers v5 はまだ Node.js v16に対応していない。 | eureka

プロジェクト生成

yarnを利用して、createコマンドを実行します。

Nuxt - Installation

yarn create nuxt-app <project-name>

不要なファイルの削除

不要なTutorial.vue、NuxtLogo.vue、store/は削除します。

代わりに、rootのファイルとしてApp.vueを登録します。

<template>
  <div>
    Hello World!
  </div>
</template>

開発サーバの起動

開発サーバを起動します。

yarn dev

f:id:yushi0:20211129013031p:plain

ブラウザで確認してみると、App.vueに記述したHello World!が表示されます。

f:id:yushi0:20211129013047p:plain

Pull Request

https://github.com/nek0meshi/profile/pull/2

あとがき

ここ最近は第2回女流ABEMAトーナメントを観てました。

熱戦に次ぐ熱戦にドラマチックな展開など、出来過ぎなくらいよくできた棋戦になっています。

有料会員登録が必要かもしれませんが、興味のある方は是非に。

abema.tv