GitHubのREADMEに画像を表示したい

Sinatraでのメモアプリ作成も終わりに近づいてきました。作成したリポジトリのREADMEに画像を表示したかったので方法を調べました。 結論 新規issueページで画像URLを生成して、READMEに生成した画像URLを貼り付ける。 手順 対象リポジトリのIssues タブ内の…

READMEの書き方

READMEの書き方 Sinatraのメモアプリも残すはREADMEの作成のみです。 読みやすいREADMEの書き方を調べてみました。 結論 先輩の方々が公開しているテンプレートの内容をきちんと理解して活用する。 ユーザー目線で考えて分かり易く書く。 僕が考える良いREAD…

XSSとその対策

Sinatraのメモアプリの終了条件であるXSS対策について調べました。 結論 文字コード指定とエスケープ(サニタイジング)を行うとXSS対策できる XSSとは 悪意あるクライアントサイドのコードをウェブサイトに挿入するセキュリティ攻撃です。 引用: Cross-site s…

nil?とempty?の違い

値の有無で真偽値を返すようなメソッドを作る際にnil? とempty? の違いが分からなかったので調べました。 結論 nil? は存在しているか、empty? は空かどうかで真偽値を返す nil? 当たり前だけどnil のみtrue を返す。 ''.nil? => false [].nil? => false fal…

requireとrequire_relativeの使い分け

Sinatraのメモアプリでhelper 読込の際にrequire とrequire_relative の使い分けが分からかったので調べました。 結論 gemなどのライブラリの読込にはrequire、helperなどの自前で用意したファイルの読込にはrequire_relative を使う。 相違点 参照方法が異…

HTMLのフォーム内で空文字でのデータ送信時に警告を出す

Sinatraを使ったメモアプリを作成中に新規投稿、投稿編集時にformタグ内のinputが未入力でPOST、PATCHで送信できないようにしたかったので調べてみました。 結論 required 属性を使うことでクライアント側(ブラウザ)でフォームが未入力時に警告を表示できる …

CSSの苦手意識を克服するためにやったこと

CSSがとても苦手です。ここ数日、CSSが苦手な理由とその対策について色々と考え、対策を試してきました。結果的に以前よりもCSSに対する苦手意識をある程度克服することができたのでその方法を記しておきます。 結論 CSSに必要な周辺知識の整理、ツールと情…

デベロッパーツールの覚えるべき最低限の操作と設定

またまたデベロッパーツール(DevTools)関連です。 これまでなんとなくデベロッパーツールを使ってきましたがもっと楽に操作したいと思って設定やショートカットなどを色々調べてみました。 機能面は全然使いこなせていないですが、最低限の設定をした事でデ…

デベロッパーツールでCSSを効率化する -Workspaces編-

前回に引き続きデベロッパーツール関連です。 どうでも良いですがデベロッパーツールって言いにくいですよね... Devtoolsと書いている記事もあったのこの呼び方の方が言いやすいですね。 でも人と話す時に「Devtoolsの〇〇を...」とか話して通じるのだろうか…

デベロッパーツールでCSSを効率化する -Local Overrides編-

CSSがとにかく苦手です。 CSSが思い通りに効かない エディタ(VSCode)とブラウザ(Chrome)を行き来してCSSがちゃんと反映されているか確認するのがめんどくさい この2つが僕がCSSが苦手な理由の大半を占めています。 今よりも効率的にCSSが書けるようになれば…

hタグはsectionやarticleタグで必ず囲まなければいけないのか

またまたHTMLネタです。 セクション要素(sectionやarticle等)をちゃんと使ってマークアップするようになった(当たり前やろ!というツッコミは無しでお願いします笑)のですが、次から次に疑問が湧いてくるので忘れないようにメモです。 結論 hタグは必ずしもs…

HTMLのセクション要素にCSSを適応しても良いのか

HTMLのセクション要素の使い方への理解が曖昧だったので復習です。 恥ずかしながらブロック要素にCSSを当てる際は今までは脳死状態でdivで囲っていました。 セクション要素(sectionやarticle等)にCSSを適応して良いのかなかなか判断できなかったので調べまし…

迷いやすいHTML タグのまとめ

Sinatraのメモアプリを開発中にマークアップを行っていたところHTMLのアウトラインを意識したマークアップへの理解がとても曖昧だったのでタグの選び方にとても時間が掛かってしまった。 別にHTMLを舐めていた訳じゃないけどFBCのプラクティスでもあまり深く…

vscodeでerbファイルをフォーマットする

Sinatraを使ったメモアプリの開発時にerbがフォーマットされなかったので設定しました。 結論 vscodeの拡張機能のBeautifyを使う。 なぜBeautifyなのか 似たようなフォーマッタとして拡張機能のPrettierがあるがerbファイルが上手くフォーマットされないらし…

nomarize.css の導入

Sinatraを使ったメモアプリの開発で久しぶりにCSSを書くことになりました。 リセット系のCSS、normarize.cssを読み込ませる手順を全く覚えていなかったので調べました。 ノーマライズCSSとは normarize.cssとはブラウザ間の差異を統一調整したCSSのことです…

複数のファイルを取得して作成日時で並び替える

フィヨルドブートキャンプの課題、Sinatraを使ったメモアプリの開発はまだまだ終わらないです メモ一覧は表示できましたが作成順に並んでいないのが非常に気持ち悪い。 複数のファイルを取得して作成日時で並び替えたいなと思ったので調べてみました。 結論 …

Ruby でID用のユニークな文字列を生成する方法

引き続き、フィヨルドブートキャンプの課題としてSinatraを使ったメモアプリの開発に取り組んでいます。 今回の課題では作成したメモのデータの管理にDBを使わず、ファイルに読み書きしてデータを管理しなければなりません。 そこで今回は他の受講生の日報を…

Sinatra のルーティングの* と: の違い

フィヨルドブートキャンプの課題としてSinatraを使ったメモアプリの開発に取り組んでいます。 Sinatra のルーティングに使われる: と* の理解がいまいちすっきりしなかったのでメモ。 結論 : は名前付きパラメータ、* はワイルドカード : の値はparams['パラ…

form タグにGET/POST以外のHTTPメソッドを指定する

フィヨルドブートキャンプの課題としてSinatraを使ったメモアプリの開発に取り組んでいます。 CRUD処理の実装でform タグを使ってHTTPメソッドのdeleteとpatch を送信する方法を調べました。 結論 _method パラメータを使いHTTPメソッドを指定する 実装例 fo…

JSONファイルから取得したハッシュのキーをシンボルにする

JSONファイルから取得したハッシュのキーがデフォルトで文字列だったのでシンボルにしたい。 結論 JSON.load、JSON.parse 共にsymbolize_names オプションをtrue にする JSON.load のみ追加でproc をnil、create_additions オプションをfalse にする JSONフ…

JSON.load とJSON.parse の違い

RubyのJSONライブラリのJSON.load とJSON.parse の違いを調べた。 結論 引数によって使い分ける。 JSON.load: 引数がJSONファイル JSON.parse: 引数がJSON文字列 JSONファイルをRubyで読み込む 読み込み用のdata.json をmain.rb で読み込んで出力してみます…

フィヨルドブートキャンプに入会して5ヶ月経ちました

2年ぶりの更新です。 いきなりですが私はまだエンジニアへ転職できていません... これまで自分なりに色々とやってきたつもりでしたが、30代からのエンジニアへの転職はかなり厳しいものだと痛感させられました。 しかし、エンジニアへの転職を諦めるつもりは…

RailsTutorialがやっと終わった

現在の状況 RailsTutorial 3週目終了 学習時間 約170時間 slack導入 やっとRailsTutorialが終わりましたー 通読含めて3週やったんですが、理解度に関してはまだまだといった感じで不安だらけ。 RailsTutorialを一度挫折した経験から、これさえ乗り越えればエ…

鈍足でも継続するしかない

プログラミングの勉強に関してモチベーション低下の防止、アウトプットに慣れるという意味でもっとコンスタンスに更新しないとダメですね。 本当は技術的な事をQiitaなどにも発信しないとなーとは思ってるんですが、まずは手軽な進捗の確認などを習慣付けた…

続ける事の大事さと難しさが身にしみた

3記事目にして2ヶ月以上更新していなかった。 前回も同じような事を書いていたような... まぁ過去の事は置いておきましょう笑 今後はしっかり週1でコンスタントに振り返ります。 ってか振り返りしないと悪い状態が常態化してしまうので自分にとってホントに…

一ヶ月はとてつもなく早く短い

始めたばかりのブログなのに全く更新できませんでした.. やっと振り返る時間と精神的余裕ができたので、反省点も踏まえてこの一ヶ月何をしていたか振り返ってみたいと思います。 progate のRubyとRailsをやった プログラミング初学者御用達「progate」をまず…

30代未経験でwebエンジニアになれるのか?

30代未経験でwebエンジニアを目指しているkarlleyです。 学歴は高卒で18歳から4年間は工場で機械メンテナンスの仕事をしていましたが、一生の仕事ではないと感じて22歳で退職 20代は興味のある仕事をいろいろやりながら好きなことをやってました(音楽が大好…