TECH CAMP入校
4月6日、ついにTECH CAMPへ入校。それから本日までに教室へ通えたのは2日目のみ。新型コロナの影響で在宅オンライン学習となっています。コミュニケーションはSlackとZOOMで行われます。でも数あるスクールの中からわざわざ教室へ通うスタイルを選んだのに残念‥。【大まかなここまでの学習内容】・Webアプリケーションとは・環境構築（準備）・HTML&CSS・Ruby・Ruby on...
View Article【HTML/CSS】混乱しないためのnth-childまとめ
この記事はnth-childを使おうとすると毎回？？？？ってなるからまとめたぞ。よく使うものも含めてぱっと見でわかるようにしたから、tableの指定とかで発狂しそうになる人はたまに見て心を落ち着かせて欲しい。nth-child一覧（よく使うやつ）※数字とかはサンプルで入れてるだけnth-childの種類説明:only-child要素が一つしかない時:first-child最初の要素:last-chi...
View Article初心者によるプログラミング学習ログ 293日目
100日チャレンジの293日目twitterの100日チャレンジ#タグ、#100DaysOfCode実施中です。すでに100日超えましたが、継続。 100日チャレンジは、ぱぺまぺの中ではプログラミングに限らず継続学習のために使っています。 293日目は、おはようございます293日目...
View Articleローカル開発環境でCSSが反映されない原因（キャッシュが残っていた）
まだまだPCについての知識が乏しいので、当たり前な人からしたら当たり前なのかもしれませんが、自戒の念も込めて記しておこうかと...chrome内でキャッシュが残っていたローカル開発環境で開発中、CSSを何度設定しても、反映されず。。。...
View ArticleClik here to view.
（初学者向け）LP作成時の型・作法など
はじめにこの記事は、ランディングページ(LP)を手早く作成するために、どのLPにも使える共通部分や、書く際の作法をまとめたものです。復習と備忘も兼ねて、本記事を執筆いたしました。本記事記載のソースコードを起点に、コンテンツの追加、CSSの変更、Bootstrap等のフレームワーク実装を行っていただき、各々が目指すデザインのページへと進展させていただければ幸いです。前提条件として以下の点にご留意願いま...
View ArticleHTML/CSSの学習記録
HTML/CSSについて学習した内容を書いていきます。HTMLとタグHTMLには様々なタグがあり、タグそれぞれに意味や使い道が決まっている。ニュアンスによって同じコンテンツの表示にしても使うタグも変わってくる。タグの具体例h1<h1>これはh1です</h1>...
View Article【JavaFX】CSSの書き方【随時更新】
JavaFXの情報が少なすぎるので必要だと思った事はどんどん書いていきます。CSSの適用方法sceneに対してgetStylesheets().add(String s)すればOK。コードのどの時点ででも適用可能(要検証)。ここはいろんなところに書いてあるので参考にすべし。Main.javacss = "application.css";...
View Articleインライン要素とブロックレベル要素を完全に理解する
なぜこの記事を書いたか最近Webサイトのリニューアル案件をやっていて、ひたすらフロントコーディングしてるのですが、この辺ちゃんと理解していなかったし、ggってもイマイチな感じの記事だけだったので、思い切って書いてみました。ここを参考にして基本のおさらいと実践みたいなことをできれば。インライン要素とブロックレベル要素HTMLにはたくさんタグがあるが、これらは「インライン要素」と「ブロックレベル要素」の...
View ArticleSNSのブランドカラーとロゴのダウンロードURL（2020年4月）
シェアボタンを自作したついでにサービスのカラーコードとロゴのURLをまとめておく。（毎回調べるの面倒なんですよね…）Twitter#55aceeTwitterのブランドリソースFacebook#3b5998Facebook Brand ResourcesLINE#00b900LINE APP ICON GUIDELINEはてなブックマーク#00a4de素材集 -...
View ArticleClik here to view.
【HTML/CSS】SREのフロントエンド復習日記
普段は、インフラ周りを中心に開発を行なっているのですが、もう一つのプロジェクトでフロントエンドを触ることになったので、一から学び直しています。基礎のところからどしどし書き残していきます。HTML基礎HTML の基本 - ウェブ開発を学ぶ | MDNコーディング規約こんなHTMLとCSSのコーディング規約で書きたい - QiitaCSSmargin と...
View Article【質問】フリマアプリの販売管理の仕組み構築に関して
初めての投稿です！開発に関しては初心者で、現在勉強中のものです。タイトルにある件で質問させていただきたいのですが、メルカリやラクマ、ヤフオク、paypayフリマなど、フリマアプリの一括販売管理をしたいと思っています。元々は職歴としてアパレルECの業界に携わっていたのですが、アパレルブランド用には在庫管理ツールがいくつもあるので、今回個人的に使えるような仕組みが作れないかと思い、考えております。超ど素...
View ArticleClik here to view.
ブラウザでお絵かき＆保存をしよう！
ブラウザで絵を書きたいときってありませんか？この記事では、HTMLのcanvasとJavaScriptでお絵かきアプリ【色・消しゴム追加編】に、独自にいくつか機能を加えたものを紹介します。コピペすれば導入できるようにしてあります。完成するとこんな感じ追加機能、改善点文字の太さを、調節バーに加えて、直接数字でもいじれるようにしたこと。文字の太さの選択範囲を５倍拡大したこと(1〜10 →...
View Article一番高さがある要素にあわせてcssを指定
script.jsjQuery(function($){window.addEventListener('load',function(){varmaxHeight=0;$('.slider...
View ArticleレスポンシブサイトでデバイスサイズごとにJSを切り替える。
PCとSPでデザインが違う時に、使用したので忘れずにメモ。script.jsjQuery(document).ready(function($){if(window.matchMedia('(min-width: 768px)').matches){$(function(){/* ウィンドウサイズが768px以上の場合 */});}else{$(function(){/*...
View Article疑似クラス+要素連結をマスターする。
はじめにCSSを使っていて、案外つまづきやすいポイントなのでまとめてみた。ここで例に取り上げるのはhoverのみだが、:checkedや:active、:visitedなどでも同様に作用するぞ。普通に利用する場合html<style>/* patern0...
View ArticleClik here to view.
WordPress cssファイルを更新する際の備忘録
はじめにWordPressの使い方に慣れていないため、本番環境にアップロードした内容の編集方法を備忘録として残しました。この記事ではcssファイルの編集について記述します。またphpファイルでも同様の方法で編集できます。記事の更新については以下のとおりWordPress記事を更新する際の備忘録開発環境テスト環境・Local by...
View Article初心者によるプログラミング学習ログ 294日目
100日チャレンジの294日目twitterの100日チャレンジ#タグ、#100DaysOfCode実施中です。すでに100日超えましたが、継続。 100日チャレンジは、ぱぺまぺの中ではプログラミングに限らず継続学習のために使っています。 294日目は、おはようございます294日目...
View ArticleレスポンシブHTMLメールで2カラム載せる
レスポンシブHTMLメールで2カラム載せるレスポンシブメールにおいて、2カラムで記述＋Outlookを考慮した記述を整理する目的で記述。デモ See the Pen YzyGXQV by NENE (@nenenene) on CodePen. コード該当箇所のみtest.html<!-- 2カラム --><!--[if (gte mso 9)|(IE)]>...
View Article