みっちぇのWebデザイン研究所

はてなブログのカスタマイズを中心に、ウェブデザインについて研究するブログ

2021-09-01から1ヶ月間の記事一覧

JavaScriptの勉強07【分割代入って何なん?】

前回の記事 micche-labo.hatenablog.com 配列まで学んだJavaScript。 そろそろ何か作りたいがもう少し基礎の勉強を。 ということで出てきた「分割代入」。 またしてもなんじゃそりゃ?ってなったんで記録。 はじめに このシリーズはjavascriptを触ったことの…

chrome更新したら、デベロッパーツールが日本語に

先ほどGoogle chromeを更新したら、デベロッパーツールが日本語になってました! 一応アプデで何が更新されたかかるく紹介。 続きを読むからどうぞ。

jQueryでアコーディオンメニューの挙動が思うようにいかなかった時の初歩的ミス

忘れないうちにメモ。 単にjQueryの練習で、slidUp()とslideDown()を使用して、アコーディオンメニューのような挙動にしたかっただけ。 マウスが乗った時にメニューが出てきて、外れた時にしまう。 ただそれだけなのに、liにのせて、いざ子要素のulにマウス…

JavaScriptの勉強06【配列と配列メソッド】

前回までで文字列について学びました。 前回の記事 micche-labo.hatenablog.com 今回は配列について勉強していきます。 はじめに このシリーズはjavascriptを触ったことのない初心者が勉強のために記事にまとめて、頭の中を整理しよう!というシリーズです。…

JavaScriptの勉強05-3【文字列メソッド】

前回、テンプレートリテラルを用いて便利にソースコードを書くことを学びました。 今回は、文字列メソッドについて学んでいきます。 前回の記事 micche-labo.hatenablog.com はじめに このシリーズはjavascriptを触ったことのない初心者が勉強のために記事に…

JavaScriptの勉強05-2【テンプレートリテラル】

JavaScriptの基礎を学ぼうのコーナー。 当方、HTML、CSSしか経験ない(しかもどっちも独学)主婦です。 JavaScriptを学べば他の言語も覚えやすいと巷で見かけ、いろいろ手を出しかけたものの、きちんとJavaScriptを学んでから戻ってこようと思い、一から勉強…

プログラミング初心者がChromeをおすすめする理由【デベロッパーツール・拡張機能】

こんにちは。 今回は、独学でHTML、CSS(SCSS)、そして今現在JavaScriptを勉強中の主婦が、愛用中のブラウザ・Chromeについての記事になります。 Chromeってなに? Chromeだとなにが便利? デベロッパーツールの使用方法 おすすめ拡張機能の紹介 などをご紹…

JavaScriptの勉強05【文字列】

勉強シリーズ。 前回は数値についていろいろと学びました。 過去記事 micche-labo.hatenablog.com micche-labo.hatenablog.com 代入・比較演算子と結構頭がこんがらがってきたのですが、次は文字列について学んでいきます。 「数学は苦手だから理解しづらか…

JavaScriptの勉強04-2【代入演算子・比較演算子】

文系・プログラミング未経験(html、cssは経験ある)の主婦が送る、JavaScriptのお勉強コーナー。 前回は【数値と演算子】について学びました。 前回の記事 micche-labo.hatenablog.com 今回の記事はその続きです。 代入演算子なるものを学んでいこうと思いま…

ラベルつきボックスを作る【記事でも使用中】

プログラミングの勉強用記事ばかりあげてたので、ここいらでWebデザインの記事を投稿させていただきます。 よく巷で見かけるラベル付きボックス。 サンプルは1種類 × 4色。 とりあえず形だけ作って、あとはなんぼでもいじってデザイン整えていきましょ!の気…

JavaScriptの勉強04【数値と演算子】

勉強シリーズ。 基礎の基礎を知る。 前回の記事 micche-labo.hatenablog.com 初めに宣言しておきます。 わたしは算数が大の苦手です。 特に繰り上がり・繰り下がりの計算がまるでできません。 胸を張っていうようなことではないんですが、算数できない私でも…

JavaScriptの勉強-変数テスト編【MDN Web Docsのスキルテスト使用】

今回はJavaScriptの練習でお世話になっているMDN Web Docsのサイトでテストができるので、使い方を記事にまとめてみました。 英語のページですが翻訳すると微妙に日本語の順序がおかしくて理解しづらい…と感じたので、同じようにJavaScriptの勉強をしていて…

JavaScriptの勉強03【条件文・関数・イベント】

勉強シリーズ。 基礎の基礎を知る。 前回の記事 micche-labo.hatenablog.com 今回は巷でよく見る条件文。 このシリーズはjavascriptを触ったことのない初心者が勉強のために記事にまとめて、頭の中を整理しよう!というシリーズです。 ためになるかはわかり…

JavaScriptの勉強02【変数のデータ型・コメントアウト・演算子】

勉強シリーズ。 基礎の基礎を知る。 前回 micche-labo.hatenablog.com 前回はvar、let、constについて学びました。 今回は変数のデータ型について知っていきます。 このシリーズはjavascriptを触ったことのない初心者が勉強のために記事にまとめて、頭の中を…

JavaScriptの勉強01【var・let・const】

勉強シリーズ。 基礎の基礎を知る。 勉強のために使用したサイト developer.mozilla.org とりあえずvarとlet(あとconstも)どれを使えばいいのかっていう話をどこかでも見かけたのでもう一度おさらい。 以下サイト様がわかりやすかったです techacademy.jp …

JavaScriptの勉強

宣言します…! 今日からJavaScriptを勉強します。 html,cssときて、jQueryやVue.jsを少し勉強してみたのですがやっぱりちゃんとJavaScriptを勉強した方がいいなと感じたので、1から勉強してみようと思います。 すべて独学できているのでJavaScriptも独学で頑…

記事下にシェア用のSNSボタンを作る

記事下のSNSボタンをデフォルトからはやくデザイン整えたかったのをようやく調整しました。 今回の実装内容 ボタンの種類は はてなブックマークボタン twitterシェアボタン FaceBookシェアボタン Pocket保存ボタン の4つ。 ホバーエフェクトは 少し大きくな…

擬似要素でアーチの上に画像を載せたフッターを作る

CSSで作る、フッターデザインの覚書き。アーチの上に画像をのせたようなデザインにしてみます。擬似要素を使います。はてなブログでも再現可能。他のブログやホームページでもできると思います。是非参考にしてみてください。

cssで新窓表示_blankの時だけアイコンをつける

よくある、「リンクを新しい窓(タブ)で開く」の横にある、 のようなアイコンをcssで表示させる方法。 Font Awesome 5 使用。(フリー版) 覚書きシリーズ。

はてなブログのテーマをVScodeで自作する

覚書。 ターミナル起動してgithubからダウンロード、Sassの設定、の流れが初心者には難しく、なかなか行き詰まってテーマ制作まで進めない…となりがちだったので、MacのFinder上での操作とVScodeでの操作で完結させる方法。 過去記事は以下 micche-labo.hate…

ハンバーガーメニューのアニメーション

覚書。

はてなブログでアカウントを複数作成するには

はてなブログでテーマ制作をする際、ブログの数を増やしたいと思っても無料版だと3つまでしか作れないので、サブアカウントを作って最大15つまで制作できるようにしよう!という記事です。

プライバシーポリシー

当ブログにおける個人情報の取扱いについて、以下のとおりにプライバシーポリシーを定めます。 運営者情報 運営者:みっちぇ ブログURL:https://micche-labo.hatenablog.com/ お問い合わせ:お問い合わせはこちら 個人情報の利用目的 当ブログでは、メール…