プログラミング一覧 - つぶデコジェネレーターメーカー

ハクト@WEBエンジニア

hakuto00

アドレスバーでキーワード入力後、別タブで開きたい場合に便利

#Chromeショートカットキー
 #駆け出しエンジニアと繋がりたい
 #プログラミング初心者

Google Chrome 【アドレスバー】のショートカット[キーワード]+alt+enter新しいタブを開いてGoogle検索

ハクト@WEBエンジニア

hakuto00

glob関数はパターンにマッチするファイルを取得したい場合に便利

#PHP
#プログラミング初心者
 #駆け出しエンジニアと繋がりたい

$複数の拡張子を指定してマッチしたファイルを取得するPHP$files = glob('*.{php,html}', GLOB_BRACE); print_r($files);OUTPUTArray$

ハクト@WEBエンジニア

hakuto00

ジット...

#IT用語の発音
 #プログラミング初心者
 #駆け出しエンジニアと繋がりたい

ハクト@WEBエンジニア

hakuto00

Laravelでテーブル操作の際に使用するartisanコマンドです
--create、--tableオプションを付けなくてもファイル生成できますが、付けると雛形が作成されるので便利です

#laravel
#駆け出しエンジニアと繋がりたい
 #プログラミング初心者

マイグレーションファイル作成（テーブルを新規作成）php artisan make:migration [ファイル名] --create [テーブル名]マイグレーションファイル作成（テーブルを編集）p

ハクト@WEBエンジニア

hakuto00

要約変数を使うと可読性も上がり、処理内で使い回す際にも長々とコードを書かなくていいので便利ですね。

#リーダブルコード

$要約変数を使用して条件文を短くするif ($user->age >=20 && $user->prefecture=='tokyo'){ ... } Readable Code$is_ad$

ハクト@WEBエンジニア

hakuto00

条件文や関数などで()を複数付ける場合、対応した括弧があるか不安になることがよくありますよね。そんな時にこの拡張機能は便利です。

#vscode拡張機能
 #駆け出しエンジニアと繋がりたい
 #プログラミング初心者

Visual Studio Code ExtensionBracket Pair Colorizer 2対応するカッコが色分けされて
分かりやすくなる

ハクト@WEBエンジニア

hakuto00

mkdir ~/{a,b,c}：ホームディレクトリ配下にa、b、cディレクトリを作成
mkdir -p ~/{a/a_sub,b,c}：上記+aディレクトリ配下にa_subを作成
まとめて作成したい時に便利

#linuxコマンド
 #駆け出しエンジニアと繋がりたい
 #プログラミング初心者

Linuxコマンドmkdir - ディレクトリの作成基本（ディレクトリが新規に作成される）$ mkdir dir複数階層のディレクトリを一括で作成$ mkdir -p dir/sub_dir1/sub

ハクト@WEBエンジニア

hakuto00

最初の要素を取得する場合
jQuery:「$('#id').find('p').eq(0)」
JavaScript:「id.querySelector('p')」
です

#jqueryとjavascriptの比較
 #駆け出しエンジニアと繋がりたい
 #プログラミング初心者

$('#id').find('p');jQuery子要素を取得する方法let id=document.getElementById('id');
id.querySelectorAll('p');j

ハクト@WEBエンジニア

hakuto00

複数選択対応なのがうれしい。
ちなみに「Alt+Shift+↑or↓」だとコピーとなります。
こちらも複数行選択対応で便利。

#vscodeショートカットキー
 #駆け出しエンジニアと繋がりたい
 #プログラミング初心者

VSCODEAlt+↑or↓カーソル行を上または下に移動SHORTCUT KEY

ハクト@WEBエンジニア

hakuto00

これは昔からエージャックスと呼んでいた気がする。
アジャックスと呼ばないよう注意しよう。

#IT用語の発音
 #駆け出しエンジニアと繋がりたい
 #プログラミング初心者

IT用語の発音AjaxエージャックスアジャックスJavascriptで非同期に
サーバと通信を行う技術

ハクト@WEBエンジニア

hakuto00

ループ内部もネストが深くなりそうならcontinueで返す

#リーダブルコード
 #駆け出しエンジニアと繋がりたい
 #プログラミング初心者

ループ内のネストを避けようfor(let i=0; i< user.length; i++){
if (user[i].age >= 20){
if (user[i].ge

ハクト@WEBエンジニア

hakuto00

windowsは「Ctrl+t」。
「Cmd+Shift+t」だと最後に閉じたタブに移動します。

#Chromeショートカットキー
 #プログラミング初心者
 #駆け出しエンジニアと繋がりたい

Google ChromeショートカットキーCmd+tタブを開いてそのタブに移動

ハクト@WEBエンジニア

hakuto00

Gitlensは以下のような機能があります
・コード単位で誰が変更したか分かる
・マウスオーバー時に前回の差分を表示
・コミットメッセージで変更理由も把握できる
・履歴や変更内容も分かる
拡張機能からgitlensで検索！

#vscode拡張機能

Visual Studio Code ExtensionGitLens誰がいつ、何故コードを
変更したかが分かる

ハクト@WEBエンジニア

hakuto00

検索条件は他に
-size:ファイルサイズを指定し検索(+1k=1kバイト以上)
-type f、-type d:ファイルのみ検索
-perm:パーミッションで検索
などがあります

#linuxコマンド
 #駆け出しエンジニアと繋がりたい
 #プログラミング初心者
 #find

Linuxコマンドfind - ファイル・ディレクトリを検索基本$ find [検索パス] [検索条件]現在のディレクトリ配下で拡張子が「.txt」のファイルを検索$ find ./ -name "*

ハクト@WEBエンジニア

hakuto00

最初の要素の値を確認する場合
・jQuery
=> $('input[type=checkbox]').eq(0).val();

・JavaScript
=>document.querySelectorAll('input[type=checkbox]')[0].value;

#jqueryとjavascriptの比較
 #駆け出しエンジニアと繋がりたい
 #プログラミング初心者

$('input[type=checkbox]');jQuery属性を指定して要素を取得する方法 document.querySelectorAll('input[type=checkbox]')

ハクト@WEBエンジニア

hakuto00

特定のカラムのみ更新したい場合はupdateメソッドが便利ですね。

#Laravel
#駆け出しエンジニアと繋がりたい
 #プログラミング初心者

$Laravel 2種類のDB更新メソッドuse App\Models\User; //saveメソッドを使用 $user=User::find(1); $user->name = $requ$

ハクト@WEBエンジニア

hakuto00

どうすればネストが浅くなるかを常に意識したいですね。

#リーダブルコード
 #駆け出しエンジニアと繋がりたい
 #プログラミング初心者

$ネストの深いif文は避けるif (is_data1){ if (is_data2){ if(..) } }Readable Codeif (!is_data1) ret$

ハクト@WEBエンジニア

hakuto00

「Cmd+Shift+Enter」で上に空行を挿入できます。
Windowsは「Ctrl+Enter」「Ctrl+Shift+Enter」

#vscodeショートカットキー
 #プログラミング初心者
 #駆け出しエンジニアと繋がりたい

VSCODECmd + Enterカーソルの下に空行を挿入SHORTCUT KEY

ハクト@WEBエンジニア

hakuto00

素材・拡張機能などの紹介用テンプレです。
https://generator.tubudeco.com/g6558/

アイコンが表示される拡張機能
何のファイルか分かりやすくなって便利

#vscode拡張機能
 #駆け出しエンジニアと繋がりたい
 #プログラミング初心者

Visual Studio Code Extensionvscode-iconsエクスプローラーに
アイコンを表示する

ハクト@WEBエンジニア

hakuto00

メール一斉送信のテストを開発環境でしていたつもりが本番環境だった。。。
考えただけでも恐ろしいですよね。
見た目を変えて、このような致命的なミスを起こさないようにしましょう。
https://chrome.google.com/webstore/detail/web-site-labeler/mjfpdplnncblmeagcgaahpbdmkpchhek?utm_source=qiita

#GoogleChrome拡張機能
 #プログラミング初心者
 #webエンジニア