CSS
レスポンシブ対応するためにmax-widthの指定を解除する方法
CSS CSSのクラス名にはいつも迷わされます
毎回、コーディングする時にどんなクラス名にしようか迷ってしまいます。とりあえず、皆さんがつけているクラス名を参考にしながら、できるだけ分かりやすいクラス名をつけていこうと思います。今回のコーディング課題【中級Ex編】でクラス名をつけるのに参...
pug pugファイル内のコメント記述には注意
以前、pugを初めて学習する段階でも一通りまとめていましたが、何回かエラー表示を繰り返してしまったので、備忘録として残しておく。pug内でコメント表示にする際は「//-」を使う。CSSやJavaScriptでよく使う「//」だけと勘違いして...
CSS 命名規則はBEM/mindBEMdingをベースに行ってみる
前回の記事でFLOCSS設計思想に基づいて、CSS設計を行っていくという話をしました。そちらで参考サイトの方は、命名規則をBEMMindBEMdingで行っているとのことでしたので、早速調べてみました。下記サイトが分かりやすかったので参考に...
CSS CSS設計について、今回（【中級Ex編】）はFLOCSSでやってみます
前回のコーディング課題【中級編】では、初めて設計思想というものを導入し、メジャーなBEMに基づいて行いました。ただ、やりながら使いづらさを感じていました。今回、【中級Ex編】までに、gulp導入ついでにpugも取り入れたこと、参考にしたのせ...
pug Pugの導入にあたって参考にしたサイト
のせっちさんのBrainにはGulp導入で大変お世話になりました。そんなのせっちさんのブログでPugについて、その構成の仕方などを詳しく解説してくれていましたので、ブログにて共有しておきます。こちら↓また、gulpfile.jsにたった1行...
Git 【GitHub】SSH接続の初回設定
以前、初回pushできたがディレクトリ構成がおかしなことになっていたため、再度トライ。またエラー表示出たので、メモしておきます。「git init」してから初回SSH接続する際に「git remote add origin <ssh接続用の...
Git Gitの知識を体系的にまとめてあるサイト【( ..)φメモ】
こちらでは、自分のメモとしてGitについての知識を体系的に学べそうなサイトのリンクを貼っておきます。将来的にもしっかり勉強して基礎を身に着けておきたいです！
Git Gitで「error: RPC failed; curl 92 HTTP/2 stream 0 was not closed cleanly: CANCEL (err 8)」となった時の対処法
Gitでなかなかpushできずにいたところ、再度ディレクトリ構成から見直して新しく「git init」を行い、リモートリポジトリも再度新しくしてpushすることにしました。※push↑出来なかった経緯はまた別記事にて。今まではhttpsで接...
運用・保守 ホームページがGoogle検索エンジンへ登録されていることを確認する
ホームページを公開した直後、なかなかサイトが検索結果に表示されないという悩みを持っていました。そこでまずは、ホームページがGoogle検索エンジンに登録されているかどうか、という確認から始めてみました。これは検索結果に表示されるための最初の...
pug Pugのルールを参考サイトをもとに自分なりにまとめてみた
今回はPugのルールを、以下参考サイトを参照してまとめました。自分の中に整理するためにも、ここにまとめておきたいと思います。参考サイト： ： ：Pugの公式サイトはここ→【自分なりにまとめたPugの基本的な書き方、ルール】・タグ...
pug Pugとは？
この記事では、Gulp導入時に出会ったpugというものについて簡単に触れておきたいと思います。Pug（パグ）とは、HTMLを効率的に書くための記述方法で、テンプレートエンジンと呼ばれるものの一つ。Pugでできることなどを、記事最下部の参考サ...
gulp Gulp導入+webpackとの連携を、ここで一旦終了とします！
前回の記事まで、Gulpやwebpackでの不具合が出ていましたが、今優先すべきことを見なおし、これ以上はトレースしないことにしました。とりあえず、不具合は出ているものの、最後までコードをトレースし、理解しながら進めることはできました。Gu...
gulp Gulp導入時のエラー④画像の圧縮とwebpの生成がされない
srcに保存した画像を圧縮をかけて、ついでにwebpの生成までしてdistフォルダにコピーする、ということをしたいです。コマンドを打って、正常に処理は終了しますが、①サマリーの出力で全部数値が０のまま②画像のコピーは出来ているけど圧縮されず...
gulp Gulp導入時のエラー③webpackでJSバンドル時、JS文のエラーは出ないが、JSで記載したコードがブラウザ上で実行されない
ついに、webpackとの連携まできました。ここまで何度も小さいエラーが出てきましたが、何度も乗り越えてきました。次は、JSのバンドルについてです。一応、import文とexport文を書いたjsファイルがバンドルされて、bundle.js...
gulp Gulp導入時のエラー②index.pugが正常にdistフォルダへコンパイルされない【解決済み】
引き続いて、Gulp導入時のエラーです。始め、コードを書いてコンパイルしたら、ルートディレクトリにもともと置いてあったindex.htmlの方が更新されていました。試しにルートディレクトリにあるindex.htmlを削除して再度「npx g...
gulp Gulp導入時のエラー①開発モードとプロダクションモードの切り替えがうまくいかない
タイトル通りです。エラー発生時はプロダクションモードしか正常に作動せず、時間を置いて触ったら、今度は開発モードしか正常に作動しない、という展開に・・・・。解決策が見つかれば、記事を更新していきます。
本業 自分が初めて作ったシステムは惨敗でした【本業ネタです】
本業でExcelのVBAを使って、システムを組んでいます、というお話を先日しました。お話をユーザーさんから頂いて、初めて自分なりに作ってみたシステムを上司に報告して、レビューを受けてみました。結果は・・・・・惨敗でしたorz実は上司も、片手...
Web制作全般 SEO対策に時間を取られています
ここ数日、確保した時間はほとんど案件の方に時間を割いてしまい、勉強時間に回せておらず焦っているたなちよです＾＾；皆さんおはようございます。今日はいかがお過ごしでしょうか。昨日夜活に切り替える！と宣言した次の日、ちゃっかり子どもたちの寝かしつ...
本業 初めてVBAを扱っています【本業ネタです】
エクセルに関しては、ユーザーとしてしか触ったことのない私ですが、転職して今の職場に来て、自分でVBAを組むお仕事を任せて頂けることになりました。窓口接客業兼一般事務の前職では、VBAに触ったこともありませんでした。もともと紙ベースの仕事が多...
Web制作全般 HP運用について考える
現在、コーディングの独学ロードマップ上にいる私ですが、縁あって案件を頂き、ホームページを制作・公開まで担当させて頂きました。このことは先日の記事でもご報告させて頂きました。作ることに集中していた私ですが、せっかく作ったものがより多くの方の目...
Web制作全般 VSCodeのターミナルでpowershellもGitBashも開ける
今回の記事は、まんまタイトル通りなのですが、2日前くらいの記事で、VSCodeのエディタ部分とターミナル部分をショートカットキーで移動する、という内容を書いたかと思います。実はこの時、VSCode上でターミナルへの移動はしていても、GitB...
Web制作全般 Git Bashで便利なコマンド～インストールしたパッケージの確認とファイルの中身を見たいとき～
今、webpackとGulp導入を進めている最中ですが、個人的に便利だなと思ったコマンドを2つ挙げておきます。（Node.jsとGitをインストールして、Git Bashにてコマンドを使い操作しています。Windowsのターミナルは使い勝手...
Web制作全般 VSCodeでターミナルを開き、ショートカットキーでエディタと行ったり来たりする(for Windows)
最近は、CLIを使ってコマンドを書くことが習慣づいてきたため、キーボードを使うことが多くなってきました。そのため、ちょっとしたことでもマウスではなくてキーボードで操作をしてみたくなります。そして、VSCodeでターミナル（今までは別ウィンド...
Web制作全般 webpackとgulpの導入を進める
HP案件と並行してですが、WebpackとGulpの導入も進めています。こちらの導入に関しては、しょーごさんもロードマップを完走した後に実践しながらで良いかな、とおっしゃていました。ただ、私としては実践に入る前に出来るだけ使えるようになって...
Web制作全般 HPを作った後のことについて考える
今、web制作のコーディングを勉強中ですが、縁あってHPリニューアルのお仕事を頂けたので、サーバーの契約から公開まで担当させていただきました。いろんなことが非常に勉強になり、とても有難い気持ちです。そして公開まで至った後、クライアントの方か...
ロゴ制作 ロゴ制作
今対応させて頂いている案件でロゴ制作も依頼があったので、自分で作ってみることにしました。ロゴ制作をするツールはたくさんあって、本当に簡単に作成できるものから、凝って作りたい場合にはいろいろな機能がついているものまで様々でした。機能がたくさん...
Web制作全般 HPリニューアルの件がひと段落しました
何とか形にして、本日公開まで持ってくることができました！WordPressの有料テーマを使った案件ではありましたが、1人でサーバーの契約からWordPressの導入、HPデザイン（もどき）、制作、公開までを担当することができて、本当に勉強に...
Web制作全般 SNOW MONKEYを使ったHP制作
初めてテーマというものを使って、１つHP制作を行いました。使ったテーマは「SNOWMONKEY」という有料テーマです。このテーマは年間のサブスクリプション型で商用利用可能となっていて、web制作をお仕事にしていこうとする身としては扱っていて...
Web制作全般 しょーごさんのコーディング課題【中級編】完走しました！
レビュー2回目まで指摘された箇所（フォントのtransform）を修正して、ポートフォリオとして活用させて頂きたいと思います。以下となります。よろしければご覧ください。ユーザー名、パスワードともに「tanatiyo-01」です。参考までに、...
Web制作全般 コーディング課題【中級編】完走。出来た事。反省点。振り返り。
先日、しょーごさんのコーディング課題【中級編】を無事に終えることが出来ました。完走者のサイトを見ようか・・・と思うこともありましたが、とりあえず自力で走りきるところに拘りました。若いころ、人になんでもすぐに聞いてしまうのが私の悪い点でもある...