ウェブ制作高速なWebサイトが作れるAstroをReactでつくる方法 Astroでは簡単に静的サイトをビルドできるWebフレームワークとのことで、今回はReact.jsを取り入れた環境を用意してみたいと思います。はるReact.jsTypeScriptNext.jsがわかる前提でゆるく説明してみたいと思います...2022.08.19ウェブ制作
ウェブ制作【VS Code 設定】編集中ファイルでエラー箇所があるとエラー音がうるさいので消したい時の方法 はる編集中ファイルで記述のミスなどで赤くエラー表示されてるところでポコポコエラー音がして禿げるかと思ったので消し方をメモしておきます。はる基本設定の設定を開く検索で『audiocueserror』で検索autoとかonになっているのを『of...2022.05.27ウェブ制作
ウェブ制作TDK Meta Checker をアップデート!Chromeの拡張機能 meta情報を確認しやすくした拡張機能TDKMetaCheckerはGoogleの拡張機能で、Webサイトのmeta情報をわかりやすく確認するための機能です。Web制作者目線で確認したい内容だけに絞って表示してくれます。シェアデバッカーとカ...2022.04.16ウェブ制作
ウェブ制作VSCode + Stylelint で、CSSファイル以外でエラーが出る対処法(TypeError: result.apply is not a function at 〜) VSCodeにStylintの拡張機能を使用中に、jsファイルを保存時に、なぜか『TypeError:result.applyisnotafunctionat...』と、Stylelintのエラーが出る問題が出て消す方法をメモVSCodeの...2021.10.08ウェブ制作
ライフスタイルTikToker ケチャップが使っているグッズを調べてみた はるTikTokerのケチャップさんを見つけて、ケチャマニ化がすすみ、登場するゲーミングチェアとヘッドフォンが何か気になり調べました。TikTokerケチャップとは引用:プロフィールTikTokで240万人以上のフォロワーで、(10/3現在...2021.10.03ライフスタイル
ウェブ制作Flexboxをゾンビゲーで楽しく学ぶ海外ゲームのクオリティーがやばい はるFlexboxの挙動を遊びながら学べるゲームを発見しました。めちゃくちゃクオリティーが高くてびっくりしました!Flexboxの挙動を遊びながら学べるゲーム!バージョンが2.0になってアニメーション・オーディオなどのパワーアップ現在のWe...2021.09.27ウェブ制作
ウェブ制作CSSだけで追従表現ができる『position: sticky』で3つの表現 はるCSSの『position:sticky』で一部分を追従する表現が簡単にできるので、その紹介をします。JavaScriptを使わなくても追従表現ができる.wrap{position:relative;}.inner{position:s...2021.09.26ウェブ制作
ウェブ制作CSSで縦と横の中央寄せをする3つの方法 はる今回は、CSS要素を縦と横の中央寄席する方法を紹介します。3つの方法を紹介しますが、それぞれにメリットデメリットもあるので紹介します。結論から言うと、flexを使い中央寄せをする方法が一番シンプルの指定にはなるのでそれを使うのがおすすめ...2021.09.21ウェブ制作
ウェブ制作HTML・CSS入門 講座 はるHTML・CSSをこれから始めたい!という人に向けて記事を書いています。『パソコンまずどうしたらいい?』から、チュートリアル形式でHTML・CSSを学べる連載記事なども用意してます。環境を用意しよう!「パソコンはどんなのがいい?」「ブラ...2021.09.19ウェブ制作
ウェブ制作教科書には載っていないコーディングする人に知っていて欲しい14のこと はるフロントエンジニアのはるです。今回は、コーディングをする人で入門者を脱却するために私が思う気をつけて欲しいことを紹介します。プルリクチェックをする機会も多く、コーディングを始めたばかりの人たちにこれは知っていて欲しいなと、思うことを紹介...2021.09.18ウェブ制作
ウェブ制作slint –init の『Would you like to install them now with npm?』をNoを選択しyarnでインストールする時のメモ はる現在、りあクト!という本で勉強をしていて、Kindleからうまくコピペができなかったのでメモメモ。注意『りあクト!』という本を読んでいて、勉強メモです。読んでないで見た人は参考にしちゃいけないメモ。$yarneslint--initの実...2021.09.15ウェブ制作
ウェブ制作【フロントエンジニア】Laravel Mix での開発環境が高機能で簡単なので入門方法を紹介 はる今回は、取っ掛りにくいwebpackで作成する開発環境を簡単に用意できる『LaravelMix』を紹介したいと思います。LaravelMixとはwebpackベースのフロントエンドのビルドをするための開発環境を、シンプルな記述で用意して...2021.08.28ウェブ制作