Aikの技術的な進捗部屋

技術的な進捗とか成果とかを細々と投稿するブログです。時々雑記も。

お久しぶりです&これまでの技術インプットほんの少しまとめ

はじめに

気づけば最近全然記事投稿してなかったですね…。
最終投稿した記事は「2019年3月15日」。ちょうど4ヶ月間空白期間が…いやはやすっかり。
ちょうどこの時期はいろいろ予定なりなんなりがごった返していたので。

また、そのごった返しの影響で最近まで「技術的なアウトプットが全然できていなかった」ように思えます。
折角ですしこれを機に「最終投稿した日から私がどのような技術を身につけたのか」をちょっとまとめてみたいと思います。
((良いアプトプットとなりそうですしね!

※なお、今回の記事は「自分への備忘録」と言った意味合いが強いので、あまり技術的に参考になる話はないかもです…。

では行きましょう!

身につけた技術

4ヶ月前の自分と比較すると、技術分野で言えば大まかには「Web」系の技術が身についたように思います。
また、アーキテクト部分に関する知識とか色々が少し身についたように思えます…!

また、Web系と言ってもフロントエンドやバックエンド、クラウド技術(AWSとかAzureとか)等色々別れてくると思いますが…。
個人的には「フロントエンドもバックエンド(特にクラウド技術)も両方身についたかな」と思います!
(特にバックエンドについては、元々の自分の技術力がなさすぎたというのも大きいです…。

将来的には「フロントエンドもバックエンドもどちらも出来るエンジニア」を目指したいなと思いますが、今の混沌としたWeb界隈でそんなハードモードを安易に目指すのもあれなので…。
しばらくは何方かを専門的に学んでいこうと思います。
個人的にはフロントエンド方面が面白そうだなと感じております!

次からは分野に絞って、どんなことを学んだのかを具体的に見ていこうと思います。

フロントエンド

特にVue.jsは日本語ドキュメントも充実していますし、コミュニティも盛んですし、非常にとっつきやすい構造をしているためちょっとしたApp作成(Todoアプリとか)にも用いています。
Reactにもいずれ手は出したいなと考えておりますが…いつになるかな…(遠い目)

また、jQueryはね…うん…何というか…。
でも「ちょっとした動きをささっと作りたい時」には本当に重宝するなぁと感じますjQuery
なので、ちょっとした動きを作る部分に取り入れるのはアリかな…と考えなくも…。

ただ、あまりに便利すぎるので安易に導入してしまうとjQueryに頼り切ったものが出来上がるように思えます。
これにより、例えば:

  • jQueryの挙動に依存しすぎているDOM構成を作ったり
  • アプリケーションロジックにまでjQueryの挙動と連動しすぎているものを作成したり
  • DOMの状態を様々な部分で連動させすぎたせいでDOM状態が管理できないものを作ったり

するのはよくないかなと思います。
jQueryに自らのアプリケーションがどこまで呑まれてしまっているかを確認していくのが大事なのかな…。

バックエンド

  • AWS
  • Pulumi(ほんの少しわずか)

最後にあげたPulumiについてはほんの少ししか知りません…「どういうものか」を少し知っているくらいです。
ただ、どちらも非常に面白そうな技術だと感じたのでね!
(特にPulumiは知人が個人で触っているのを見て知ったのですが、非常に面白そうな技術でした!)
ぜひ個人開発でも扱ってみたいなと思います…!

ちなみに余談ですが…。
以前私がちょっと触っていたTheiaの経験から、下記のようなアプリケーションは今時結構あるのかなと思っていたのですが:

  • フロントエンドはReactやVue.js等のモダンフレームワーク
  • アプリケーションロジック部分はNode.jsで記載
  • オンプレミスではなくAWSやAzure、GCP(Google Cloud Platform)等のクラウド型で賄う

この件を知人にお話しすると、「Node.jsで書かれているのはよほど制約のない自由な環境で作られているんじゃないかな…」という返答が。
まぁこの辺は会社によって異なってきそうですね。

アーキテクト

アーキテクトの領域についても、ある程度の知識は付いてきたかなと思います。 個人開発の領域ではこのアーキテクトの知識を活かせるか微妙ですが…。

というかそもそもアーキテクト構造を考慮する必要があるほどの大規模アプリケーションを作るのかって話もありますし…。
何より今のご時世、アーキテクト領域はフレームワークが担っているようにも感じますし。
ただ、このアーキテクトの知識については今後のエンジニア人生に確実に必要となる知識であるように思えます!

その他

特にGitについては、私自身がこれまでチーム開発でGitを使用したことがなかったので…。
(というかチーム開発自体滅多にやってこなかったですし)
ブランチを切って他のブランチと隔離してあげたり、各ファイルの過去と今の差分のみを取り込めたりと、Gitの利便性に改めて気づけたと思います。
あ、あとしっかりConflictも体験してきました。自分のローカル環境とリモート環境とでリポジトリの同期を取る重要性が理解できました…。

また、巷でちょっと有名なNotionというアプリも少し触ってみました。
こちらについてはぜひ別記事にまとめてみたいなと思います!!

また、Excelについてですが…。
あくまで、あくまで「個人的な所感」なのですが、Excelが大嫌いになりました
Excelをちゃんと表計算ソフトとして利用しているならともかく…WordやPowerPointみたいな使い方をされたファイルを見ると、本当に虫酸が走ります。
まぁでも、それだけExcelが使いやすいっていう裏返しなのでしょうがね…。

終わりに

こうして自らのことを振り返ってみると、結構いろんな知識が着いたのかなぁと思います。
自分を振り返り自らの今の技術レベルを見つめなおせる、というのもアウトプットの良いところですね。シミジミ…。

また色々ごった返しの日々に慣れ、「ようやくこうしてブログ記事を投稿できるだけの余裕ができた」のかなと思います!
今後の記事投稿予定ですが、出来るだけ月に1回は投稿していきたいなと思います。
((とはいえ、あんまりガチガチに予定決めちゃうと予定に圧死されるタイプなので、ゆる目標くらいな勢いでやっていけたらと思います。

それでは|д゚)

「色に関係するWebサービス」をまとめてみました

はじめに

先ほど自分用に「色に関係するWebサービス一覧」というのを文書化してまとめてましたが…。
「これ普通にブログ記事として公開してもよくね?」な情報量になったので公開しようかなと。

なお、自分用にまとめた文書なので…ちょっと荒く紹介してたりしてます。
また、自分自身これらのツールをそこまで熟知してないので、紹介できれてない機能とかもいっぱいあると思います。
あくまでご参考程度に留めて頂ければ幸いです。

((もし気になったら実際にアクセスして使ってみて下さい。本当に素敵なツールばかりなので…!

色に関係するWebサービス一覧

とにかく何でもいいからいい感じのカラーパターンを知りたい
  • Color Hunt: とにかく沢山のカラーパターンを見れる
  • Pigment: 提示されたカラーパターンを自分である程度いじる事もできる
配色原理を守りカラーパターンを決めたい
  • Color Supply: プレビューで色んなパターンが見れる
  • Adobe Color CC: 自分のカラーパターンを保存可能&他の人のカラーパターンを見たりいじったりも可能
既に決めている色と調和する色を知りたい
既に決めているテーマ色が1色あり、他の色に迷っている
  • Coolors.io: 色を決める!スペース連打!いい感じの色がいっぱい出てくる!ヤッター!
グラデーションパターンを見たい
  • uiGradients:グラデーションに名前もついてる&貼り付けるだけでOKなCSSもコピれる
  • WebGradients.com: 機能的にはuiGradientsと似てるが、こちらの方が一覧性が高く一気に様々なパターンを見れる
何とも分類し難い…
  • Colordot: 配色をガチでグラフィカルに直感的に決められる…説明がむずいので試しに使ってみてくだしあ
  • NIPPON COLORS: 日本の伝統色を見ることが出来る。日本の伝統色は彩度低めで使いやすい色が多いので参考にすると面白いかも
  • Accessible Brand Colors: ブランドカラーの良さを判断してくれる。自分のブランドカラーがある人は試しに使ってみるといいかも?
  • Colours: 様々なWebサービス(Facebook, Pinterest…)で用いられている配色パターンを見れる。配色決めの参考に
ポータルサイト

終わりに

結構並び連ねました…。
こういったサービスは今のご時世本当めっちゃ沢山ありますので、自分の用途にあったサービスを選ぶことが大事かなって思います。

にしても今ではこんなに色に関する素晴らしいWebサービスが出てるんですね…。
もう自分の頭の中だけで悩むよりも、こういったツールに頼った方が楽に色々出来そうだなって思います。

また他のWebサービスとか見つけたら紹介するかもしれません。
それでは|д゚)

Feedly使ってみました

はじめに

1年ほどかけて(実質は4ヶ月程度だけど)行ってた大きめなタスクも終わり…。
来たる4月に向けて自由な日々を過ごしてます。

「でもただダラダラ過ごすのもなぁ」と思っていると、同チームの先輩からRSSリーダーを用いた情報収集のやり方について聞く機会があり。
そのやり方がとってもいいなぁと思ったので…。
今回の記事ではそのやり方とかを備忘録がわりにちょっと書いておこうと思います。

また、自分はどの様にやってみているとかやってみた感想とかもちょっと書こうかなと。
(まぁここ2週間程度しかやってないのですが)

※また、RSSについてはお恥ずかしながら「ちょっと古いやつ??」といった知識しかなかったので…。
折角の機会に、このRSSについてちょっと調べてみることにしました。
一番最後の余談として、少しだけまとめています。

RSSリーダーでの情報収集方法

Feedly

先輩から教わったのはFeedlyというサービスです。 feedly.com

こちらは「RSSリーダー」というもので…。
各サイト等が発信している「RSS情報」を読み取り、そのサイト内での最新記事等を保存してくれると言うもの。
記事の内容や画像も拾ってくれるので、ざっくりと理解するだけならわざわざサイトに飛ばずともFeedlyだけで完結できそうです。

ただ、画像が読み込まれない記事もあるので…。
なるべくはサイトに飛んでから見た方が良いかなぁとも感じます。

なお、Webサービスなのでアカウントさえ作ればPCからでもスマホからでも同一のものが見れます。
スマホアプリもあるので、電車内で読んだりするにも都合が良い感じです。

Feedlyへの登録方法とかは下記の記事を参考に。
RSSリーダー feedlyを使ってみよう - PC設定のカルマ

上記記事内のリンクより、Feedlyの使い方等も見ることができます。
Feeldyは特に私の様なRSSリーダー初心者初見では「ん??」となる機能が多いので…。
上記記事や色んな記事で使い方を見るとなかなか良いなと感じます…。

Pocket

それと…先輩からは、Feedly以外にもPocketというサービスを教えてもらいました。
getpocket.com

こちらはインターネット上に転がる様々な記事等(正確にはURL?)を保存してくれるサービスです!
超高機能なブックマークアプリとでも言ったら良いでしょうか?

簡易リーディング機能もあるので、記事内容だけをざっと把握するならPocketだけで完結できるのも良い所。
まぁFeedlyと同じく…画像が読み込まれなかったりするので、なるべくサイトに飛んだ方がいいかなぁとは思います。

こちらもWebなのでアカウントさえ作ればPCからでもスマホからでも同一のものが見れます。
スマホアプリもしっかりありますよ!

Feedly + Pocket

そして、先輩から教えてもらったこのFeedlyとPocketの使い方は、

  1. Feedlyで色んな記事のタイトルと概要だけをざーっと漁って
  2. 面白そうな記事をPocketに入れ
  3. Pocket経由で後から見る

というもの。
Feedlyに登録したサイトから、常に自分の興味がある記事ばかりを配信してくれるとは限らないですからね…これはいいぞ!

早速自分もやろうと思いましたが、どうやらFeedlyからPocketに記事を共有するにはFeedlyの有料アカウントが必要な様で…。
有料アカウントに登録しようかなとも思いましたが、貧乏性な筆者にはちょっと勿体無く感じ…。

他に何か方法はないものか…と探してた所、とあるWebサービスを見つけてしまいました。

Feedly -> inoreader

www.inoreader.com

inoreaderは、Feedlyとよく比較されているRSSリーダーです。
機能もよく似ていますが、inoreaderの方が無料で出来そうな幅が広い印象を受けます。

また、嬉しいことにinoreaderは日本語対応!
Feedlyは日本語対応が無いので…英語苦手な筆者としてはすごく嬉しい機能です。

そして何より嬉しいのは、Pocketとの連携が無料アカウントでもできる所。
これで先に述べた事が無料で出来るようになります…ありがたい!!

また、(Feedlyにも同様の機能がありそうですが)各サイト毎の「更新された記事数と自分が読んだ記事数」をグラフ化してくれる機能もあり。

"各サイト毎の更新された記事数と自分が読んだ記事数をグラフ化してくれている画像"
こんな感じ

これを見れば、その日1日でどのくらい自分が記事を読んだのか(頑張っているか)も見る事が出来ます!
大量の記事を毎日読むのは大変ですが、こうしてグラフ化してくれているとなんだかやる気が出てくる気もします。

※なお、この機能は「フィードの設定」>「フィードの情報を表示」からいけます。

ただ、この時点で既にFeedlyにて様々なサイトでのRSS登録を済ませてしまっている段階…。
またinoreaderでも同じ作業しないといけないのか…と思いましたが、なんとinoreaderにはインポート機能があるらしく。

設定>インポート/エクスポートより、OPMLのインポートから簡単に移行作業を済ませる事が出来ました。
(他のRSSリーダーでもこの様にインポート出来るようですね)

今後はinoreader+Pocketでガンガン情報収集していきたいと思います!

((なお、Feedlyと比較したinoreaderの欠点?としては、知名度の低さかなぁと。
((どうやらFeedlyRSSリーダー界では頂点に君臨されているらしく…。
((「オススメカスタマイズ方法」とか「オススメの使い方」とかって記事はFeedlyの方が沢山出てくる印象です。
((inoreaderも少なくはないのですが…Feedlyと比べると少し見劣りしちゃうかな。

自分のinoreaderカスタマイズ状況

折角なので、この記事執筆当時のRSSサイト登録状況やカスタマイズ状況やらを記しておきたいと思います。

RSSサイト登録状況

現状の登録してるサイトリストはこんな感じです。

また、最近はてなブックマーク - 人気エントリーからも更新を受け取る様にしてみました。どんな記事があるかな…。

他にもいっぱい登録してますが、主要で見てるのはこんな感じかな。
中でも★を付けてるサイトは「Daily-article」フォルダに入れて、なるべく毎日見る様にしてます。
(まぁ…これだけで毎日100記事以上くるので消化不良を起こしてますが)

もしおすすめのサイト等がありましたら、コメントとかしてもらえると嬉しいです_(:3 」∠)

個人的なおすすめ設定

まず、記事一覧のビュー形態ですが…自分はPC版ではカードビュー形態にしています。

"カードビュー形態での記事一覧"
こんな感じ

画像も取ってくれるってのと、情報量がちょうどいいってのでこの形態にしてます。
(同様の理由でスマホ版ではマガジンビュー形態にしてます)

自分は良さげな記事があったら新規タブでそのサイトに行って記事を見てますが…。
inoreader内で完結させたい!って場合は、カラムビューでもいいかなと思います。

"マガジンビュー形態での記事一覧"
こんな感じ

また、設定項目の振る舞い>スクロールトラッキングというものもONにしてます。

"スクロールトラッキングの項目の場所"
こんな感じ

こうすると、下にどんどんスクロールするだけで未読記事を消化できるのでかなり楽になるんですよね…良い。

他の項目は、基本的にデフォルトの設定のままにしてます。
デフォルトの設定でもかなりいい感じに動いてくれるんですよね。
(筆者が無知なだけで、他にもいっぱい便利な機能があるかもしれませんが…)

使ってみた感想

ここからは、このinoreader + Pocketで日々新しい記事を見るのを始めた筆者の感想とかをちょっと書きたいと思います。

まず、使ってみて…だいたい3日くらいかな?して…
その日1日で更新されている記事を全て見れなかった所謂消化不良が発生しました。
RSSサイト登録状況にある★を付けている記事しか見てなかったのですが、その日ちょっと記事を見る時間が足りなかっただけで100記事程度の未読記事が…。

幸いにも次の日にゆっくり見れたので消化不良分は解消できたのですが、なかなかに辛かったですね…。
(おまけに興味ある記事のみを見てるだけでこの状態っていうね)

また、体感ですが…あの★を付けているサイトで1日に更新される記事数は、だいたい150〜170記事くらいかなと。
興味あるのしか見ない様にしても、困ったことに面白そうな記事が多く…毎日平均70記事くらいは見てしまいます。
とてもじゃないけど毎日見るのは出来そうにないかなって量…。
日々のニュースを追っかけるだけで1日の1/4くらい潰れる感じになってます。

まだ今は春休み、1日を自由に使える期間なので、1日の1/4くらいの時間はどうって事ないのですが…。
通勤時間に消化できる量ではなさそうだなと痛感してます。

まぁでも、新技術を知ったり、記事をきっかけに自分の知らない技術分野を深掘りしたり新しい用語を知ったり…。
更には様々な考え方とかも知れたりして楽しいので、今のうちはこのままで行こうかなって思います。

それに、読む記事が多いのは自分の勉強不足なところもあるかなって思ってて…。
この様に日々勉強していければ、自然と「読むべき記事/読まなくても良さそうな記事」の判別もつくかなぁと。
春休みが終わったら…うん、またその時にいろいろ考えればいいかなって思ってます。

最後に

最後の方は自分の感想が主になっちゃいました…。
まぁ1つ言えるのは、こうして情報収集を始めたおかげで様々な知識を会得できる環境が構築できたって事でしょうかね。ヤッタゼ!

もし見ていった記事の中で面白そうな内容等がありましたら、また別途この記事にまとめようかなとも思っています。
それでは〜_(:3 」∠)

余談-RSSとは

RSSとは「Really Simple Syndication」、または「Rich Site Summary」の略語で、Webサイトのニュースやブログなどの、更新情報の日付やタイトル、その内容の要約などを配信するため技術のことです。
RSSは、XML形式で記述されており、RSSリーダーと呼ばれるツールを使用することで、様々なサイトの更新情報や新着情報を自動的に取得することができます。

つまり、RSSリーダーにお気に入りのWebサイトのRSSを登録することで、わざわざお気に入りのサイトへアクセスしなくても、更新情報や新着情報をチェックすることができます。

参考記事:RSSって何?RSSの仕組みを理解し、RSSリーダー「Feedly」を使ってみよう! : ビジネスとIT活用に役立つ情報

RSS リーダーは、リーダーに登録されたWebサイトのRSSをチェックし、新しく追加された新着情報があれば、その「ページタイトル」「アドレス」「見出し」「要約」「更新時刻」などを表示します。
その中から興味のある見出しをクリックすると、該当ページが表示されます。
もちろんリーダーには複数のサイトを登録することができるので、短時間で複数サイトの新着情報を把握することが可能です。

参考記事:RSSって何?RSSの仕組みを理解し、RSSリーダー「Feedly」を使ってみよう! : ビジネスとIT活用に役立つ情報

以前は無料で使えるRSSリーダーとして、「Googleリーダー」というものがあった様ですが…。
サービス利用者の減少を受け、2013年にサービスを終了してしまったとのこと。

まぁ今ではSNSとかで情報を収集するっていう手段もありますしね…。
筆者の友人にTwitterを結構やってる方が居るのですが、情報収集率が凄いというか…今時はTwitterを用いて情報収集してもいいかもしれませんね。
(どっちもやれたら最強なのでしょうが…それは流石に無理ですかねぇ)

参考記事: - RSSって何?RSSの仕組みを理解し、RSSリーダー「Feedly」を使ってみよう! : ビジネスとIT活用に役立つ情報 - RSS - Wikipedia