つぶデコ

装飾してツイートしよう

投稿一覧

ブラウザによって挙動やレイアウトが異なることは頻繁に発生するので、実装する前にCan I useを活用してみてください。
https://caniuse.com/

#プログラミングツール
#駆け出しエンジニアと繋がりたい
#駆け出しwebデザイナーと繋がりたい

Can I useHtml、CSSの対応状況を調べられる調べたいCSSのプロパティやJavaScriptの
文法を入力ボックスに入れると
対応ブラウザが一覧に表示されます

配列化したinput要素をカンマ区切りでDBのカラムに格納する場合などによく使用してます。

#PHPとjavascriptの書き方
#駆け出しエンジニアと繋がりたい
#web制作

$animals=['dog','cat','pig'];
$str_animal=implode(',',$animals); 
echo $str_animal; //dog,cat,pigP

windowsだと「ctrl+/」。

「cmd+l」などで複数行選択した後に 「cmd+/」で複数行コメント/解除ができます。

#vscodeショートカットキー
#駆け出しエンジニアと繋がりたい
#駆け出しwebデザイナーと繋がりたい

VSCODECmd+/現在の行をコメント/解除SHORTCUT KEY

アイコンを1つメニューに配置するだけで、お気に入りのGoogleサービスを切り替えられます。

ページ移動せずにメールのチェックやGoogleドライブのフォルダの閲覧も可能で便利!
https://chrome.google.com/webstore/detail/black-menu-for-google/eignhdfgaldabilaaegmdfbajngjmoke?hl=ja

#GoogleChrome拡張機能
#駆け出しエンジニアと繋がりたい
#駆け出しwebデザイナーと繋がりたい

Google Chrome ExtensionBlack Menu for Google今いるページからGoogle検索ができる

様々なGoogleサービスをリストから
切り替えられて、小さな

比較用のテンプレです
https://generator.tubudeco.com/g6555/

jQueryとJavaScriptの書き方の違いを比較してみました。
jQueryシンプル

#jqueryとjavascriptの比較

$(’div’)jQueryCSSセレクターで取得する要素を指定document.querySelectorAll('div')javaScript

TBSラジオの報道記者、澤田大樹ここにあり!
#アシタノカレッジ

澤田大樹報道記者

SEOなどのアイキャッチ画像に使えます
https://generator.tubudeco.com/g6554/

SEOはキーワードを意識することも大切ですが
検索エンジンの先にはユーザーがいることを忘れてはだめですよね

Googleガイドライン
https://developers.google.com/search/docs/advanced/guidelines/overview?hl=ja

#SEO
#ブログ初心者
#駆け出しエンジニアと繋がりたい

ブログするなら知っておきたいGoogleガイドライン検索エンジンではなくユーザーの利便性を最優先する検索エンジンがなくてもその記事を書くかどうか同分野の他のサイトと比べて差別化できているか

上の例で日本語訳すると
「20が年齢以下か」
となり直感的に理解しづらい。

下の例だと
「年齢が20以上か」
となり自然

#リーダブルコード
#駆け出しエンジニアと繋がりたい
#駆け出しwebデザイナーと繋がりたい

if文の引数の並び順を意識しよう//定数->変数順だと分かりづらい
if (20 <= age)Readable Code//変数->定数順にしよう
if (age >= 20)

シンプルでいいですね。
ちなみに「@guest」ディレクティブを使用した場合は「@auth」と逆。
ログインしていな場合に「true」を返します。

#Laravel
#駆け出しエンジニアと繋がりたい
#駆け出しデザイナーと繋がりたい

Laravel Bladeで認証状態をチェックできるディレクティブ@auth
 <p>ログインしています</p>
@else
 <p>ログインしていません</p>
@endauth

素材サイトの紹介、アイキャッチ画像などに使えるテンプレです。
https://generator.tubudeco.com/g6553/

Unsplashはクオリティが高い画像が豊富なので
素材探しを忘れてつい見入ってしまう。。。
https://unsplash.com/

#素材
#駆け出しエンジニアと繋がりたい
#駆け出しデザイナーと繋がりたい
#ブログ初心者

Unsplashfind the best free imageハイクオリティな写真が無料商用利用・画像加工可能クレジット表記不要

良し悪しを比較できるテンプレを作りました。
https://generator.tubudeco.com/g6552/

変数名に単位をつけるとコメントがなくても直感的に理解できますね。

#リーダブルコード
#駆け出しエンジニアと繋がりたい
#駆け出しwebデザイナーと繋がりたい

変数名に単位をつけよう//単位が曖昧
let margin=2;Readable Code//単位が明確
let margin_rem=2;

直前に編集していたタブに戻りたいときよく使います。
Ctrlキー押しっぱなししで、tabキーを押すと切り替えるタブを選択可能。
操作しづらい場合は「cmd+shift+[」「cmd+shift+]」でも切り替えできますよ

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

VSCODECtrl+Tab同一グループのタブ切り替えSHORTCUT KEY

MySQLコマンド紹介用のテンプレを作りました
https://generator.tubudeco.com/g6551/

このコマンドはデータ移行時によく使います。
エクスポートで「--add-drop-table」オプションをつけるとdrop文が挿入されます

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

MySQLのインポート・エクスポートコマンド

HTTPステータスコード。
200はリクエストが成功した場合に返却されるコードです。
APIを使用すると意識するようになりますよね。

#HTTPステータスコード
#プログラミング初心者
#駆け出しエンジニアと繋がりたい

200OK