きままに記録箱

フロントエンドたまに他のはなし

2020-01-01から1年間の記事一覧

「今年買ってよかったもの」&「来年には欲しいもの」in 2020

また時期が空いてしまいました。miruoonです。 今回は「今年買ってよかったもの」「来年には欲しいもの」をまとめていきたいと思います。 今年買ってよかったもの Apple Watch SE(GPSモデル) 最新 Apple Watch SE(GPSモデル)- 44mmスペースグレイアルミニウ…

リーダブルコード学習メモ

転職先でリーダブルコードを読むことになり、とりあえず1周読破したときの学習メモ。 ※15章は本書で出てきたコード作法を使った設計例の話だったので、記載していません 1章-理解しやすいコード-まとめ コードは他の人が最短で理解できるように書く コードは…

更新再開します

ということで無事転職活動が終了したため、更新再開いたします。 11月から希望通り自社開発のWebエンジニアになります。 この世情での活動だったため、半年はては1年かかるんじゃと思っていましたが、なんとか2ヶ月で終わりました。 主な転職理由はよくあるS…

WSL2にDockerをインストール

今回はWSL2にDockerをインストールする手順を掲載する。 前提条件 WSL2をインストール済みかつ利用できていること Dockerとは? https://knowledge.sakura.ad.jp/13265/ https://qiita.com/SatoshiSobue/items/a612ebbb3a9242c09db5 上記の記事でも説明され…

WSL1をWSL2にアップデートする

今回はWSL1をWSL2にアップデートする手順を掲載する。 前提条件 PCのWindows10がVersion2004、build19041 以上であること WSL1をインストール済み 注意:Windows10のバージョン2004へのアップデートは不具合対応のため、現在対象PCは不具合の影響を受けないP…

きんきょう(2020/7/18時点)

お久しぶりです。 相変わらず平日は都内通常出社の身なのと帰ったらでコーディングテストの練習もあり、ブログのネタすら考える時間もなく、時間が空いてしまったので生存報告代わりにこの記事を書く。 最近やっていること コーディングテストの練習 paizaの…

正規表現でマッチさせる(URLとメールアドレス編)

最近Youtubeの動画リンクを正規表現でマッチさせようとしたら苦労したので備忘録としてまとめる。 URLだけでもいいかと思ったが、それだと物足りないのでメールアドレスも紹介する。サンプルコードはなし。 今回の対象読者 正規表現は下記のリンクの内容レベ…

ESLint+JestでJavaScriptのコードをテストするための解決策

最近作成しているプロジェクトにJestを導入したのはいいが、ESLintを導入していたためにJestが使用できなくなって困ったので解決策の備忘録。 いつもよりは内容短いです。サンプルコードは入れていません。 今回の対象読者 作成中のコードにESLintとJestを導…

webpack入門その1(JavaScriptファイルをバンドルする)

今回はフロントエンドで近年ほぼ必須となっているwebpackについて基本的な使い方を紹介する。 ただし一気に全部紹介してしまうと、初見では意味がわかりづらい横文字も多く読んでいくうちによくわからずに挫折しかける人も多そうなのでシンプルにJavaScript…

VSCodeでGitを利用する+Github連携まで(WSL1編)

先日VSCode上から初めてGitとGithubにリポジトリをプッシュしてきたので、備忘録として書く。 batファイルは使いません。 今回の対象読者 Git・Githubとは何か把握されている方*1 Windows Subsystem for Linux(WSL1)を使われている方(先日正式版になったW…

ESLint+PrettierでAirbnb JavaScript Styleを適用する

今回は有名なコーディングスタイルの一つであるAirbnb JavaScript Styleを適用し、JavaScriptで書かれたコードをスタイルにそって書けるようにする方法を紹介。 今回の対象読者 ESLint・Prettierの基本的な使い方を使っていること Airbnb JavaScript Styleを…

今までのサンプルコード投稿した

これまでの記事で使用したサンプルコードをこちらのGithubリポジトリに掲載しました。 どう見てもコメント足らずなのでまた時間があるときに更新しておきます。。。 github.com 対象記事はこちらです。 katanugramer.hatenablog.com katanugramer.hatenablog…

ESLintでJavaScriptの文法をチェックする(VS Code拡張機能の使い方も)

今回はESLintを使ってシンプルなJavaScriptの文法チェックする方法を紹介。 今回の対象読者 ESLintとはなにか、使い方を知りたい人 VS Codeの拡張機能の使い方を知りたい人 前提条件 PCにバージョン10.12.0以上のNode.jsインストール済みであること ESLintっ…

Prettierの使用メリットと設定ファイル作成

前回は拡張機能をインストールし、とりあえず何も設定してない状態でコードが綺麗に整形(フォーマット)されているところまで確認した。リンクはこちら。 katanugramer.hatenablog.com 今回は引き続き拡張機能を使用し、整形方法の設定方法と使用メリットな…

VS CodeのPrettier拡張機能の使い方

フロントエンドとかnpmとかコマンドとかよくわかんないから、拡張機能だけ入れてすぐ使いたい人のためにメモ。 ※VS Codeは「Visual Studio Code」の略です。 まずPrettierって何? 一言で言うと、ソースコードを自動で整形してくれるツール。 色んな言語に対…

てすと

初投稿です。OSS文化に魅了されつつあるノンWeb系SEです。 このブログでは以下のトピックを扱いたいと思ってます。 Web Development初心者なりに学んでる様子。 Tipsも載せていきたい。あまり日本語情報のないものも記事にしていければなと。 他の人が見ても…