webエンジニアの気づき

都内ベンチャーでwebエンジニアとして働く著者が、web開発における気付きをまとめています。golang,railsやVue.js(Nuxt)を主に利用。

100の文法暗記より1のサービス

f:id:k-enter:20210412073600p:plain エンジニアの皆さんこんにちは〜

今日は言語の勉強についてのお話。

新卒エンジニアは、言語の勉強をするかと思います。

もちろんしないに越したことはないのですが、基本的に文法を覚えるという作業は面白くないです。(僕も言語の勉強はあまり面白いとは思いません…)

特に新卒という立場であれば、文法を理解できるくらいになったら、サービス、アプリを作ってみるのがいいと思います。

文法は、思い出せなくてもググると出てきますし(よく使う文法は自然と覚えるようになります)ディレクトリ構成や言語で利用するライブラリの知識などは、実際にアプリやサービスを作らないとできるようになりません。

日本教育って型から教える手法が一般的なので、 勉強となると

「基礎から型をしっかりと考えなきゃ」

みたいな思考になりがちなんですよね。

プログラミングがつまらないと思っているそこのあなた! サービスを自分で作ってみるのいいですよ。転職の際にポートフォリオにも載せれます。

では今日もがんばりましょう!

→Enter

環境構築は人に聞け!

f:id:k-enter:20210410101510p:plain こんにちは〜

今日は新卒もしくは未経験の方向けに、環境構築に関する僕の考え方を共有したいと思います。

環境構築は時間をかけすぎるな

新卒最初の実務はおそらく、環境構築でしょう。

SNSでも現役エンジニアさんが言っている通り、環境構築の手法は会社によって違います。

特にベンチャー系の環境構築Wikiなどは、有志で更新&モダンな開発環境による仕様変更が多い影響で、手順通りに行ってもエラーの出ることは少なくないです。

時間をかけないって言われてもできないものはどーするの?

この場合、調べるよりも歴の長い先輩エンジニアに聞きに行った方がいいです。 webエンジニアという職種は特に、新卒は自分で調べろという風潮がありますが、環境構築に関しては会社ごとに特有のものですし、会社としても早く案件をこなす方が利益になるかと思います。

dockerとか、コマンドラインなどの概要と基本的な使い方くらいは調べておいてもいいかもですね。

rookieのみなさん。めげずにがんばれ!

→Enter

dockerでvue-cliを立ち上げようとした際にnpmエラー

f:id:k-enter:20210404212219p:plain

コード

/app/frontend # npm run local-serve

> practice-app@0.1.0 local-serve
> vue-cli-service serve --mode local

sh: vue-cli-service: not found

内容

原因と考えられること

・dockerの立ち上げがうまくいかない時があり、その際にnode modulesを削除して対処していたので、そこら辺が原因かと思われる。

やったこと

・node modulesを入れ直す

解決策

rm -rf node_modules package-lock.json && npm install

考え

vue-cliがないときは、node modulesを入れ直してあげるのが吉。

package.jsonに記載があればもう一度インストールしても問題ない(node modulesはpackage.jsonに依存している)。

package.jsonがあり、package-lock.jsonが存在しない時にnpm install もしくは npm update を行うとpackage-lock.jsonが作られるようだ。

つまり、node_modules と package-lock.json を一旦消して npm install をしてあげることで、それぞれの依存関係の整合性をとることで解決に至ることができたのではないだろうか。

参考にした記事

https://ysko909.github.io/posts/fix-vue-cli-service-command-not-found-error/

【初心者向け】NPMとpackage.jsonを概念的に理解する - Qiita

package-lock.jsonの脆弱性に対応する - 文鳥大好きエンジニアのガラクタ置き場

Vue.jsでライブラリをインポートしたときにエラーが出た時はこちら↓

k-enter.hatenablog.com

dockerでgoose up ができない問題

f:id:k-enter:20210404212717p:plain

コード

npm WARN deprecated @hapi/bourne@1.3.2: This version has been deprecated and is no longer supported or maintained
npm WARN deprecated @hapi/address@2.1.4: Moved to 'npm install @sideway/address'
npm WARN deprecated @hapi/hoek@8.5.1: This version has been deprecated and is no longer supported or maintained
npm WARN deprecated request@2.88.2: request has been deprecated, see https://github.com/request/request/issues/3142
npm ERR! code ECONNREFUSED
npm ERR! syscall connect
npm ERR! errno ECONNREFUSED
npm ERR! FetchError: request to https://registry.npmjs.org/@vue/cli/-/cli-4.5.12.tgz failed, reason: connect ECONNREFUSED 104.16.24.35:443
npm ERR!     at ClientRequest.<anonymous> (/usr/local/lib/node_modules/npm/node_modules/minipass-fetch/lib/index.js:97:14)
npm ERR!     at ClientRequest.emit (node:events:369:20)
npm ERR!     at TLSSocket.socketErrorListener (node:_http_client:462:9)
npm ERR!     at TLSSocket.emit (node:events:381:22)
npm ERR!     at emitErrorNT (node:internal/streams/destroy:188:8)
npm ERR!     at emitErrorCloseNT (node:internal/streams/destroy:153:3)
npm ERR!     at processTicksAndRejections (node:internal/process/task_queues:81:21)
npm ERR!  FetchError: request to https://registry.npmjs.org/@vue/cli/-/cli-4.5.12.tgz failed, reason: connect ECONNREFUSED 104.16.24.35:443
npm ERR!     at ClientRequest.<anonymous> (/usr/local/lib/node_modules/npm/node_modules/minipass-fetch/lib/index.js:97:14)
npm ERR!     at ClientRequest.emit (node:events:369:20)
npm ERR!     at TLSSocket.socketErrorListener (node:_http_client:462:9)
npm ERR!     at TLSSocket.emit (node:events:381:22)
npm ERR!     at emitErrorNT (node:internal/streams/destroy:188:8)
npm ERR!     at emitErrorCloseNT (node:internal/streams/destroy:153:3)
npm ERR!     at processTicksAndRejections (node:internal/process/task_queues:81:21) {
npm ERR!   code: 'ECONNREFUSED',
npm ERR!   errno: 'ECONNREFUSED',
npm ERR!   syscall: 'connect',
npm ERR!   address: '104.16.24.35',
npm ERR!   port: 443,
npm ERR!   type: 'system'
npm ERR! }
npm ERR! 
npm ERR! If you are behind a proxy, please make sure that the
npm ERR! 'proxy' config is set properly.  See: 'npm help config'

npm ERR! A complete log of this run can be found in:
npm ERR!     /root/.npm/_logs/2021-03-29T14_02_59_850Z-debug.log
ERROR: Service 'frontend' failed to build: The command '/bin/sh -c apk update &&     npm install -g npm &&     npm install -g @vue/cli' returned a non-zero code: 1

内容

dockerでdbというコンテナを立ち上げて、そこにbackendというコンテナからgooseでマイグレーションファイルを反映しようとした際に、dbコンテナhostがないと言われる。

原因と考えられること

・今まで利用できていたのに、リモートの本番環境を実装した後にローカルがエラーで動かなくなったので、docker-compose.local.yml(ローカル用のdockerのymllファイル)が原因ではないかと考えられる。

・dockerを再ビルドしても変化しなかったので、イメージが残っていることが原因かと考え、イメージを削除して再ビルドした。

やったこと

・dockerのイメージを削除→再ビルド&アップ

解決策

・dockerのイメージを削除→再ビルド&アップ

考え

残っていたDockerのイメージが何らかの影響を与えていたのかもしれない。もしくはコンテナ内でgoose upを使っていなかったかも。

参考

https://kumahiyo.com/goose-status/