フリーランス チャレンジ!!

フリーランス チャレンジ!!

現役フリーランスエンジニアが書く雑記ブログ

技術

【VSCode】キーボードでエクスプローラーとエディタとターミナルを移動する

会社ではIntellij、自宅ではVSCodeを使ってます。 やっぱり長い時間使うIDEであれば、キーボードショートカットを使いこなせば開発効率は格段にアップします。 エクスプローラーのファイルをマウスで選択。 エディタをマウスでクリック。 ターミナルをマウス…

GitHub Actionをローカルで実行する方法(Mac)

Github Action GitHub Actionのworkflowを書いたんだけど、確認するのがgithubへpushなどしなければいけないと確認するのがちょっと大変。 ということで、ローカルで実行する方法が分かったので記事にします。 GitHub Actionとは actでローカル実行 GitHub A…

【Angular】Cypressスクリーンショットの差分でデグレしてないことを確認する

開発の過程で画面表示に差分が出てもCypressのcypress-image-snapshotを使えば、e2eテストで差分を検知し教えてくれるので、画面表示のデグレを心配せずにガンガン開発することができます!! cypress-image-snapshot インストール 準備 実装 動作確認 最後…

【Visual Studio Code】Githubのプルリク(pull-req)便利プラグイン

Githubにpushしてレビューしてもらったら、レビュー指摘事項をGithub見ながらソース修正しますね。 ノートPCの場合、外付けディスプレイがあれば、片方にGithub表示して、もう片方にソース修正すればいいけど、ノートPCだけの場合、画面がそんなに大きくない…

【GitHub】依存先パッケージ(ライブラリ)のSecurityAlerts(脆弱性)はマージするだけ(Botが自動的にプルリク作成)

GitHubから依存先パッケージ(ライブラリ)のSecurityAlerts(脆弱性)に関するメールを受信しました。 GitHubは依存先パッケージ(ライブラリ)でSecurityAlerts(脆弱性)が修正されるとそれを使用してるリポジトリに対して、「脆弱性が直ったからプルリクしたよ、…

【Visual Studio Code】Java開発でTomcatホットデプロイ(HotDeploy HotReload)

長年、JavaのWeb開発はeclipseを使ってて世間的にもデファクトスタンダードになってると思うんですけど、やっぱeclipseは重い!! もし、Visual Studio Codeでも簡単にホットデプロイができるんだったらもうeclipseにこだわる必要は無いですね。 ということ…

【Java DB】Webアプリケーションサンプル

以前、Springを使ってDBのデータを画面に表示する記事を書きましたが、ログイン、一覧、更新画面まで作成したのでサンプルを紹介します。 今回のサンプルでできること 環境 eclipse DataBase eclipseにインポート 動かすための準備 Tomcat設定 動作確認 最後…

Nxチュートリアルをやってみた(Add E2E Tests)

前回はnpx、ngコマンドでアプリケーションを作成しました。 今回はE2Eテスト(Cypress)をこのアプリケーションに追加します。 ※NxはデフォルトでCypressが使えるよ。 CypressってどんなE2Eテストか知りたかったら下記の記事をぜひ読んでみて。 簡単、速い、テ…

Nxチュートリアルをやってみた(Create Application)

Nxチュートリアルをやってみた!! その前にNxって何?って人もいるよね。 実は私もこのチュートリアルやる前にそんな状態でした。 プロジェクトで使ってるけど、内容理解してなくて。。。 まずはそこから調べて、チュートリアルを進めてきます。 Nxって何?…

簡単、速い、テストの動画保存、Cypressは最高のe2eテストだ!!

www.cypress.io インストールが簡単、速いe2eテスト、テストを動画で保存するなど、素晴らしいe2eテストツールのCypress!! Cypressとはどんなツールなのか? 実際にインストールしてテスト書いて実行するとこまで紹介します。 Githubにもソースを登録する…

【JavaScript】知ってた? 変数にvar付けないとグローバルスコープになるって!!

リーダブルコード posted with ヨメレバ ダスティン・ボズウェル/トレバー・フォシェ オライリー・ジャパン 2012年06月 楽天ブックス Amazon Kindle 7net リーダブルコード読んでて結構衝撃的だったので記事にしました。 サンプルコードも書いて実際に動きを…

VSCode(TypeScript)でChromeのデバッグ(Debug)をする方法

VSCodeでChromeをデバッグ(Debug)する方法をご紹介。 VSCodeにDebugger for Chromeをインストール launch.jsonの修正 デバッグ(Debug) VSCodeにDebugger for Chromeをインストール まず最初はVSCodeにDebugger for Chromeプラグインをインストールします。 ①…

【Angular】Webテスト(npm test)が失敗した時のスクリーンショットを撮る方法

Webテスト(npm test)が失敗し、エラーが発生した時にスクリーンショットを取る方法(コード)をご紹介。 ※私はMacですが、多分Windowsでもここに書いてある手順でいけるはずです。 環境(Angular、node、Visual Studio Code) 参考にしたページ 実装(コード) …

【Angular】Flex-Layout, Materialを使ったログイン、テーブル表示サンプル

最近Angularjsにハマってます!! 覚えることは多いんだけど、結構楽しくコード書いてます。 前回の記事で作成した画面にFlex-Layout、Materialを適用してもう少し綺麗な画面に仕上げます。 Flex-Layoutとは? Materialとは? 作成した画面 最後に Flex-Layo…

Angularを学ぶなら公式チュートリアルがおすすめ!!

Angular Tutorial チュートリアル 今までAngular1.3の経験しかなかったが現在の案件がAngular7を使っているため、一から勉強しようと思い、公式チュートリアルをやってみたら結構理解が深まったのでご紹介。 Angular公式チュートリアル チュートリアルの内容…

マウス使わない派の人にはEclipseよりもIntelliJをオススメします

次の現場がIntelliJを使って開発するので最近、自宅でIntelliJ使ってるんだけど、マウス使わない派の自分としては、すっごい使いやすい!! 隅から隅までIntelliJを使ってるわけではないけど、キーボード操作はEclipseよりも断然上!! もっと早くIntelliJに…

【IntelliJ】GitHubからチェックアウト(CheckOut)してIntelliJに取り込む方法

GitHubのリポジトリからCheckOutしてIntelliJに取り込む方法を画像付きで紹介します。 ※Macです。 IntelliJでGitHub連携 GitHubからCheckOut チェックアウトしたリポジトリを実行 IntelliJでGitHub連携 まずGitHubからチェック(CheckOut)アウトするためにGit…

無料で使えるIntelliJをMacにインストールする

次の現場がなんとIntelliJを使うとのことで、自宅のMacにIntelliJをインストールします。 そもそも無料でも使えるの? IntelliJの特徴 インストール手順 IntelliJ起動 Hello World表示 そもそも無料でも使えるの? IntelliJは有償しかないと思ってたんですが…

【Spring Boot入門】DI(依存性の注入)とは? サンプルソースを使って深掘り

前回は、Spring環境を作成し、"Hellow World"をコンソールに表示しました。 次は、DI(依存性の注入)について勉強していきます。 やはりネットの情報だけでは、分かりづらかったのですが本で体系的(順序立てて)に学ぶと理解が深まります。 今回も下記の本…

マルチカーソルはまるで魔法! Vimでマルチカーソルをやってみた!!

今日、下記の記事を読んで衝撃を受けた!! マルチカーソルなんて知らなかった!!! マルチカーソルを使わないVSCodeはただのVSCodeだ! - memo.md こんなことができるんです!! Vimでもできないか調べたらプラグインがあるみたい。 ちなみにMacVimです。 …

eclipseにGitリポジトリをインポート(Import)してSpring Bootに変更する手順

開発環境にGitからソースをインポート(Import)する作業ってたまにしかやらないので忘れてしまいますよね。 そこで、画面ハードコピー付きで詳細に手順を紹介します。 困ってる人はぜひ参考にして下さい。 git cloneしたリポジトリをeclipseにインポート(Impo…

【GitHub】リポジトリをクローン(clone)して別リポジトリとしてリモートにpushする手順

もうタイトルの通り。 以前、困って調べたので、画像付きで手順化。 GitHubでリポジトリを作成 クローン(clone) 別リポジトリとしてリモートにpush GitHubでリポジトリを作成 別リポジトリとしてリモートにpushしたいリポジトリを作成します。 GitHub上で「N…

【Spring Boot入門】eclipse + STS + Starter ProjectではじめてのSpring

今や、Javaフレームワークのデファクトスタンダードと言ってもいい、Spring Boot。 今まで参画したプロジェクトでも使ってたけど、用意されたものをあまり意識せずに使ってたな〜、ちゃんと基礎から理解したいな〜と思いこの本を買ったので基礎からSpringを…

【Visual Studio Code】GitのコードからAIでコーディング支援(コード補完)するIntelliCodeをやってみた

いや〜、世の中一気に進んだ気がします。 AIでコーディングを支援してくれる事になるとは・・・。 早速、やってみました!!! IntelliCodeとは コード補完 コードの問題を見つける 事前準備 拡張機能を入れる Gitからプロジェクトをクローン デバッグしてみ…

【AWS】無料でPostgreSQLを構築

AWSでPostgreSQLの構築とローカルから接続できるよう設定したので手順を紹介します。 AWS上にPostgreSQLを作成する 接続設定の変更 AWS上にPostgreSQLを作成する ※AWSのアカウント作成済み、コンソールにログインできる事前提に進めます。 AWSのコンソールに…

TeamSQLでAWSのDB(PostgreSQL)に接続する

この記事を公開してから毎日沢山の人に読まれてます。 DB接続のクライアントツールはTeamSQLで決まり(インストールから接続まで紹介) - フリーランス チャレンジ!! みんなTeamSQLに興味あるのかな? ならば、もうちょっと紹介しようと思い、今回はAWSに…

TeamSQLの機能紹介

前回の記事でTeamSQLのインストールから接続まで紹介しましたが今回は機能を紹介します。 TeamSQLはカラーテーマが選べる SQL実行について SQLクエリをTeamSQLから共有できる SQL実行結果もTeamSQLから共有できる SQLの実行結果をファイルに出力 機能を拡張…

DB接続のクライアントツールはTeamSQLで決まり(インストールからMySQL接続まで紹介)

※2019年2月27日(UTC時間 00:00)でサービス停止してるのでこのツールをダウンロードする事も出来なくなってます。 TeamSQL並みにオススメのクライアントツールTablePlusがあるので良かったらお試しください。 PostgreSQLも使える無償クライアントツールTableP…

【Gitpod】ブラウザ上でGitHubのオンラインIDEが使えるようにりました!!

これは便利です!! GitHubのIssueをブラウザ上のIDEで修正できるようになりました!! ※確かでは無いですが、Chromeのエクステンション入れればIssues無くてもGitHub上のリポジトリも普通にオンラインIDEが使えそうです。記事の最後の方を参照ください。 ※…

【Go言語】エラトステネスの篩(ふるい)で素数を求めるプログラム(10万まで調べても0.02秒)

素数を求めるのに単純に判定するより、エラトステネスの篩を使えば計算量が少なくなるため処理が高速になります。 アルゴリズムとかあまり知らずにプログラム組んでる人はぜひ呼んでください。 ちょっと世界が変わりますよ! (アルゴリズム勉強しようって気…