気付いた事やした事を表にまとめています。
Ctrl + F で目当ての用語などを入れると検索出来ます。
普段から Notion でメモしている事をそのままコピーしているだけですけど！笑
詳しく聞きたい事や間違い等があればコメント頂ければ幸いです。
今月は HTML/CSS のテンプレートファイルを作成しました。GitHub に公開予定にしています。
SASS での CSS 記述を始めました。管理もしやすいし読みやすいし最高です！
サイト上で使われていない CSS やJavaScript を削除して圧縮するシステムを Node.js で作成しました。
こちらも GitHub で公開予定です！
後は、塾講師がいよいよ本格稼働した月ですね！
あとポートフォリオも本格的に作成を開始した月です。
デザイナーさんって偉大だなぁと日々思いながら作っていました。
2022年2月
| タグ | 内容 | タイトル |
|---|---|---|
| Work | ChatWork のフリープランでのグループチャットの上限が来たので、有料プランに変更。(年払いで6,600円) | 無題 |
| PluginWordPress | Smart Slider 3 PRO 購入(5,834円) PC表示用のスライドをSP表示で見たら字が小さくて… Lightbox でポップアップ表示させようと思ったら課金してしまった。 買い切りのプラグインはいつサブスクになるか分からないし、気にぜず買うべきかな? | 無題 |
| FTPNetwork | WinSCP Microsoft Store版購入(1,150円)自動アップデート + 寄付の意味も込めて。 | 無題 |
| CSSPluginWordPress | WordPress CSSに書く場所による優先度。子テーマstyle.css < CSS and JS 内部<head>要素内 < CSS and JS 外部 < 親テーマstyle.css < CSS and JS 内部<footer>要素内 | 無題 |
| CSSHTMLPluginWordPress | WordPress そのページの情報(投稿/固定 テンプレ等)によって、body にクラスが付与される。 Show Current Template などはこれを利用しているのかも？ CSSセレクタ指定にも使える！ | 無題 |
| CSSHTMLPluginWordPress | WordPress カスタムhtml でテーブル内の td で改行されない件で、いろいろ(TinyMCE Advanced, remove_filter( ‘the_content’, ‘wpautop’ );など)やった結果 CSS で
white-space: pre-line; を効かせる事で解決した。 | 無題 |
| CSS | CSS cursor: に使用できる画像の最大サイズは128px それより大きいと表示されない。 | 無題 |
| Ai | Illustrator SVG書き出しの方法と設定。 ファイル > 書き出し > 書き出し形式 > 名前変更 > ファイルの種類をSVGに変更 > スタイル: 内部CSS > フォント: SVG > 画像:保持 > | 無題 |
| NotionWork | Notion 月を指定してエクスポートする方法。 テーブル(データベース)を複製 > 名前を変更(○年○月) > archiveの中に入れる > ○月○日を含まないという条件でフィルターをかける > …よりエクスポートする。 | 無題 |
| NotionWork | Notion のフィルター機能で日本語は上手くヒットしない。2022/02 にするなどで対応する。 | 無題 |
| Node.js | Node.js で関数の結果を変数に入れる方法がわからない。 glob()とglob.sync()の違い globとglob.syncの違いは処理結果。globはコールバック関数で処理を記述するが、glob.syncはパターンにマッチした内容をそのまま返す。 glob.sync という組み込み関数で、var files_html = glob.sync(‘../’ + domain + ‘/*.html’) とした。 | 無題 |
| Node.jsVSCode | VSCode で Python をデバック出来るようにした。 その中で、テーマフォルダ内の “html”, “php”, “js” のファイル名だけを抜き出す為に使用した。 import glob… けど、同じようなモジュールが Node.js にもあったので、jsファイルに再度コーディング。 | 無題 |
| Ps | Photoshop 使用されているフォントを一覧で表示させるスクリプト。 ファイル > スクリプト > 参照 から detectfonts.jsx を起動。 | 無題 |
| Github | Github #の数が見出しの数値になる。 他にもいろんなマークアップがある。 | 無題 |
| CSS | CSS :hover は、マージン部分にホバーしても効かない。パディングとボーダー部分にホバーした時は効く。 | 無題 |
| SASSVSCode | VSCode で SCSS Formatter をインストール。複数セレクタ指定するとカンマで改行されるが、変数内のカンマでは改行されない。ちょうどいい。 | 無題 |
| GithubNetworkVSCodeWork | 開発環境について、ローカルで開発する必要性がいまいち理解できない。 デスクトップにフォルダを置いて、それをVSCodeでワークスペースとして開く。 それをかたやGithubと連携させてバージョン管理とバックアップをとり、 かたや自サーバーとWinSCPで同期させて、自動反映させる。 | 無題 |
| SASS | SASS 計算の中の単位は最後にだけ書く。font-size: 2 * $i – 4px; | 無題 |
| SASS | SASS “/”による割り算が非推奨。掛け算で代用(/2 = *.5) | 無題 |
| SASS | SASS ネスト内で疑似要素を書く時は、&:○○ と書く。 | 無題 |
| GithubVSCode | ファイル変更後保存 > Ctrl + G (ソース管理画面に遷移) > メッセージで Ctrl + ; (日付入力) > Ctrl + Enter (コミット) > Tab → Enter (プッシュ 同期の変更) | 無題 |
| GithubVSCode | VScode と Github 連携でバージョン管理 & バックアップ | 無題 |
| VSCode | Ctrl + K O でフォルダを開く。 | 無題 |
| Node.js | npm i -D purify-css をコンソールで実行すると、PurifyCSS がワークスペースにインストールされる。(その他様々なフレームワークも一緒にインストールされる) | 無題 |
| Node.jsVSCode | Node.js フォルダに node.js というファイルを作成して、Ctrl + @ で出したコンソールに、node node.js を入れると node.js の中身が実行される。 | 無題 |
| Node.js | Node.js の npm は JavaScript の jQuery 的なフレームワークのこと(ちょっと意味合いは違う) | 無題 |
| SASSVSCode | SCSS 試しに VSCode に DartJS Sass Compiler and Sass Watcher をインストールした。 ローカルでフォルダ開いて .scss ファイルを作成したら後は保存時に自動でコンパイルしてくれる。 ちょっと使ってみたけど素晴らしい！ | 無題 |
| NetworkWork | WinSCP ローカルとミラーリング → ローカルで開発環境整えて同期する程度で十分かな？ | 無題 |
| PluginWordPress | WordPressプラグインページ > 詳細を表示 > 最下部に開発バージョンを選択してダウンロードした過去バージョンのZipファイルをインストールする事でプラグインのダウングレードが可能。 | 無題 |
| PHPWordPress | WordPress カスタムHTML で PHP は使えない。 | 無題 |
| ThemeWordPressWork | テーマフォルダをダウンロードして Windows で圧縮してインポートしたらファイル名が文字化けする。 | 無題 |
