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

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

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/ お問い合わせ:お問い合わせはこちら 個人情報の利用目的 当ブログでは、メール…

初心者の私がテーマ制作で重宝した!便利サイト・ツールのまとめ

はてなブログのテーマ制作をするにあたり、様々なサイトを参考にしました。 Web全般 Webデザイン系 クイックリファレンスサイト 便利ツール 圧縮ツール 配色参考 モックアップ Git関連 質問サイト系 プログラミングを学ぶなら Web全般 coliss 外国のサイトの…

SCSSで変数を定義すると便利で時短に繋がる!

はてなブログテーマ制作に、「Boilerplate」を使用した場合、変数用のファイルとして、「_variable.scss」というファイルが存在します。このファイルの中身を参考に、自分なりに色々と変数を作っていきます。 テーマ制作を二つ、三つとする場合も、変数を作…

.zsh_profile に.zshrcを読み込む設定方法【Node.js関連】

以前の記事ではてなブログのテーマ制作のために、環境構築をしました。 以前の記事 micche-labo.hatenablog.com その過程でNode.jsをインストール。いろいろインストール方法があるようですが、私はNode.js 用パッケージ管理ツール「nodebrew」を使用してイ…

Macではてなブログテーマ制作その2【設定とテーマ投稿】

前回、ターミナルでテーマ制作のための環境構築を行い、「Boilerplate」をダウンロード、Sassでの制作環境を整えました。 前回の記事 micche-labo.hatenablog.com 今回はその続きになります。 いよいよSCSSファイルを編集して、テーマ制作に入っていきます。…

ターミナルでのパスの通し方

はてなブログのテーマ制作のため、ターミナルでNode.jsをインストールした後で、npmが見つからないことがありました。 Node.jsのインストールに関しては以下サイト様参照 ターミナルを使ったインストール方法 いろいろ調べた結果、パスが通ってないことが問…

Macではてなブログテーマ制作その1【環境構築方法】

私が初めてはてなブログのデザインテンプレート(テーマ)を制作した時、ターミナルやGitHubについて何も知らず、かなり初めから手こずりました。 いろんなサイトを参考に四苦八苦しながら、なんの知識もない初心者の私がテンプレート制作するまでに至った経…

Macではてなブログテーマ制作の事前準備【SSH Key作成】

この記事では、Macではてなブログのテーマ制作をするための事前準備として、ターミナルでのSSH Key作成と、GitHubで新しくSSH Keyを作成する方法を紹介しています。 この記事を読んでわかること ターミナルで自分のPCにSSHKeyを作る方法と確認方法 GitHubにS…

サンプルエントリー

段落 画像(はてなフォトライフ) 脚注 続きを読む 罫線 h1見出し h2見出し h3見出し h4見出し h5見出し h6見出し asin 引用 リスト(ul,ol,dl) テーブル コードブロック 段落 あのイーハトヴォのすきとおった風、夏でも底に冷たさをもつ青いそら、うつくし…