Nuxt.js

JavaScript => Nuxt.js（二日目）

Nuxt.jsへの移植作業二日目です。

ディレクトリ構造について書かれていて

「それぞれこういった役割を振り分けられているのね」

と、ふむふむしました。

USER-no-MacBook-Air:nuxt.Rabbit-game suwa$ tree
 .
 ├── README.md
 ├── assets
 │   └── README.md
 ├── components
 │   ├── Logo.vue
 │   └── README.md
 ├── layouts
 │   ├── README.md
 │   └── default.vue
 ├── middleware
 │   └── README.md
 ├── nuxt.config.js
 ├── package-lock.json
 ├── package.json
 ├── pages
 │   ├── README.md
 │   └── index.vue
 ├── plugins
 │   └── README.md
 ├── static
 │   ├── README.md
 │   └── favicon.ico
 └── store
     └── README.md
 8 directories, 16 files

↑の、pagesの下にあるindex.vueをエディタで編集したの。

何故画像なのかというと、コードブロックで書こうとしたらスラッシュが何かに作用してうまく表示されなかったからです！そんなんばっか！

index.vue内は上記画像のようなHTML/JS/CSSの三部構成になっているので

それぞれ指定されたものをコピペしていくのですが

Nuxt.js語的な独自ルールがあって、その翻訳がいまだにわかりません。

うさぎでもわからないblog

土日は作業できるカフェを探すのだけでも苦労するの。

WiFiか電源、どちらかを譲歩できるだけでもかなりラクになるなあ

とおもった。

Dockerなどを使わなければ、ほどほどに電池もつので

むしろダラダラ作業しないためにも

電源なしの作業場所を選ぶのアリかもしれないとおもいました。

Nuxt.js移植

恵比寿でネイルしてきたよ。

くすんだベージュで落ち着いた感じになりました。

そのあとは六本木に移動して、しばらく作業。

ひたすらWordPressのタグつけ作業だよ。

PCからだと左側にタグ群が表示されて

スマホからだと右上のハンバーガーメニュー（三本線）から

タグ群が表示されるようになりました。

やったねえ。

母に頼まれて大昔に作ったHPの、ログインボタンを復活させるなどしました。

すべてgit管理したいなあ。

Rabbit-gameのNuxt.jsへの移植もすこしやったよ。

標準ライブラリやサードパーティライブラリについて

あと、コンパイルとビルドまでやるのかと知って

JavaScriptなのにJavaぶっているなと感じました。

わたしは浦島太郎なのでjQueryに触れずにきて

最新の恩恵がわからず、ただひたすら複雑化して

JS書くだけなのに何故こんなにも段階を踏まされるのか分からん😠

って気持ちだったのだけど

思い返せばdocker-composeも仮想サーバーも

以前なら存在すらしなかったけれども

現在の技術進歩によって生み出されて

複雑化してはいるのだけれども、便利だし覚えた方が良いよね。

って、ノリで覚えてきたし

JSも膨大に散らかったものを一つ一つ見るのではなく

自動化して整理されるようなツールがあるのならば

それの使い方は、積極的に覚えてしまった方がラクなのかもしれないと思いました。

こちらGitHubのブラウザ上でJSを移植しようとして一気にコピペしてpushしていたの。

移植は一行一行やっていかないとerrorだらけでわけわからんくなる😢

と、いうことで

$ git log

で、今までのgit履歴を確認して

$ git revert [ID]

で、IDを指定して消し

git pushしました。

git管理だいじ

Nuxt.jsを導入する練習をするために

Rabbit gameをexampleとして

GitHubにリポジトリを作成しました。

開発サーバーかわいい

色々と機能があるのね。

https://ja.nuxtjs.org/guide

サーバーサイドレンダリングはやらなかった。

あとGitHubの使い方少しずつ慣れてきたんだけれども

GitHub上にpushしたあとshellで修正するの慣れないので

もう少し復習したいなあってきもちです。

$ rm -rf .git

-rfは-rと-fくっつけたもの

-rディレクトリを消す、ファイルの場合は不要

-fはforce、無理やり

$ git commit -m ‘scaffolding’

-mはcommit messes

$ mv * ../

*ワイルドカードで全部

../を指定して上の階層にmv移動させる

$ cd ..

じぶんも上の階層に移動

$ mv .editorconfig ../

$ mv .gitignore ../

$ mv .nuxt/ ../

.がつく隠しファイルは*で指定できないので手動で移動

このblogドット.だらけで意味わからんくなっているな。

できたあ、かわいい。

そしてspacemacsをいれました。

Evilモードではない方にしました。

Evilって名称にemacsの悪意のようなものをやんわりと感じつつ

調べたら建前上きちんとした意味はあるぽい。

真実は謎のまま。

これから色々と設定を加えていけたら良いなあとおもいました。

現在AtomユーザーなのでAtomの使い方も復習しながら

WebのコーディングはVSCode使いこなせたら良いなあって目標です。