とある学生エンジニアがぶつぶつと独り言を呟いているだけのブログサイトです。 生きとし生けるものは幸せでありますように。
Node.js 環境構築(Mac × fish × anyenv)

Node.jsを使う機会があったのでメモ。

前提要件

以下の環境上で構築する。

  • OS
    • MacOS Catalina v10.15.6
  • shell
    • fish v3.1.2
  • Xcodeインストール済み。
  • Homebrewは使わない。
  • **env系は入っていない。

anyenv のインストール

nodenvを使ってNode.jsを管理したいので、まずはnodenvそのものを管理するanyenvをインストールする。

必ず本家サイトを参照すること。

git clone でダウンロード

$ git clone https://github.com/anyenv/anyenv ~/.anyenv

パスを通す

$ set -Ux fish_user_paths $HOME/.anyenv/bin $fish_user_paths

anyenv の初期化

$ ~/.anyenv/bin/anyenv init

結果

# Load anyenv automatically by adding
# the following to ~/.config/fish/config.fish:
status --is-interactive; and source (anyenv init -|psub)

言われた通りに以下を~/.config/fish/config.fishに追記。

※環境によって追記内容が違うかも。

status --is-interactive; and source (anyenv init -|psub)

anyenv install の初期化

ターミナルに再ログインする。

結果

ANYENV_DEFINITION_ROOT(/Users/riywo/.config/anyenv/anyenv-install) doesn't exist. You can initialize it by:
> anyenv install --init

anyenv-installフォルダ(install manuifest)が無いよと注意される。

以下のコマンドで作成。

$ anyenv install --init

途中、Do you want to checkout ? と聞かれるので「y」を押してリターン。

anyenv自体のインストールは完了。

以下のコマンドでinstallできるもののリストを確認できる。

$ anyenv install -l

各**envをアップデートするためのプラグインをインストール

$ mkdir -p (anyenv root)/plugins
$ git clone https://github.com/znz/anyenv-update.git (anyenv root)/plugins/anyenv-update

プラグインの本家サイトはこちら

以下のコマンドでアップデートできるようになる。

$ anyenv update

nodenvのインストール

$ anyenv install nodenv
$ exec $SHELL -l

yarnも一緒に入れてくれるプラグインをインストール

$ git clone https://github.com/pine/nodenv-yarn-install.git (nodenv root)/plugins/nodenv-yarn-install
$ exec $SHELL -l
$ nodenv hooks install

Node.js をインストールする

Node.jsのバージョンリストを表示

$ nodenv install -l

バージョンを指定してインストール

$ nodenv install 14.10.1

globalで使うバージョンの指定

$ nodenv global 14.10.1

Node.jsのバージョン確認

$ node -v
v14.10.1

これでNode.jsの環境構築ができた。

以上。

参考

fishでanyenvを使う

anyenvを使う

anyenv.github.io

anyenv-update

ndenv / nodenv で Node.js をインストールする際、同時に Yarn もインストールする方法

nodenv-yarn-install

はじめてのiOS勉強会からの1人ハッカソン

勉強会で作ったアプリを元に挑むハッカソン

先日、とあるSwift勉強会に参加し、はじめてのiOSアプリをビルドしました。
その勉強会の裏イベントで、iOSアプリをテーマとした1人ハッカソンが開催されるということで、学んだことをアウトプットする機会として参加してみました。
以下、関連URLです。

CountUpGame

このアプリについて

勉強会で作ったアプリを拡張して、ゲーム要素を取り入れてみました。
+ボタンやーボタンを押すと表示されている数字の値が変化する仕様だったので、新たにターゲットとなる数字をランダムに用意し、プレイヤーはそれに合わせる形でカウントアップやカウントダウンをしてもらい、スコアを稼いでもらうようにしました。
制限時間を用意したのでどれだけ速くターゲットと数字を合わせられるかがスコアゲットの鍵になります。

プレイ映像

play映像

技術的概要

  • Xcode Version 11.6 (11E708)
  • Swift Version 5.2.4
  • StoryBoardを使用
  • アダプティブユーザーインターフェイスに挑戦
  • ダークモードでも使用できるように調整(プレイ映像はダークモード)
  • import GamePlayKit
  • 乱数を生成: GKRandomDistribution(lowestValue: Int, highestValue: Int)
  • Timerを使用
  • プレイヤーの扱う数字はcount、ターゲットの扱う数字はquestionで集約(リファクタリングの余地がありそうです。)

まとめ

はじめてのネイティブアプリ制作でしたが自分なりにアウトプットできてとても楽しかったです。
ヒミツ機能としてオンライン対戦機能を付けようと思っていたのですが、、
サーバーとの通信を用いたアプリを作るには、まだまだ僕の技術的スキルでは及ばない感じです。。

大学のテスト頑張ります(^^)(全く関係ない)

リポジトリはこちらhttps://github.com/yukinissie/CountUpGame