今さら聞けないHTML　

QRコードを生成するChrome拡張機能を作る

記事「[JIS X 0510 – QRコードの GIF 画像を HTML+JavaScript (ローカル) で生成する](https://qiita.com/ikiuo/items/824b914ccd065b57a887)」を弄って Google Chrome の拡張機能（デベロッパー モード用）としてみました。


https://github.com/ikiuo/google-chrome-extension-genqrcode

ホームページを作った件。

こんにちは、ホームページ作りました。
https://4ef3ae1f-f013-4f65-9946-21f3ba993ccd-00-krcpbk60zy4o.pike.replit.dev

HTML & CSS & JavaScript でwebページに雪を降らせましょう！（寒いです）

# 初めに
今回のモノは、cssがメインなものになってるのかな？
と思われます。
意味不明なものは調べていただいたり、コメントして頂くと私も大変ありがたいです。

# 書いていこう
今回も説明（適当でごめんなさい）は、コード内で書いています。
cssはコメント多めですので、わかるとこは読んでいただかずとも大丈夫だと思います！
それではやってきましょう！

まず、HTML
“`html:index.html

WebページでKaTeXを使う

## やりたいこと
自分で作ったHTMLのWebページでKaTexがパースされるようにしたい。
ページ読み込みのタイミングではなく、ユーザーのアクションに合わせてパースされるようにしたい。

## 背景
サーバー上のcsvをjavascriptで読み取ってhtmlに表示するというwebページで、KaTeXを埋め込む必要があるということになったのですが、[公式HP](https://katex.org/docs/browser)のStarter Templateを使おうとしたら上手くいきませんでした。
今回はkatex.jsをサーバーに置いて呼び出す方法で対応することになったので、備忘録として書きます。

## 準備
[こちら](https://github.com/KaTeX/KaTeX/releases)からzipをダウンロードして、中のkatexフォルダをサーバーにアップロードしておきます。

## コードを書く
HTMLのheadタグ内にkatex.cssとkatex.jsへのリンクを記載します。
“`HTML

もうjsなんていらない！世界で流行っているHTMXについてまとめてみた

# HTMXとは

https://htmx.org/

HTMXは、JavaScript を記述せずに、Ajax通信や高度なUXを実現できるライブラリ。

**軽量** で **高速** で、既存のサーバーサイドのフレームワークとシームレスなやり取りができる。また、AJAX通信の発火、フォームの送信処理、DOMの更新などを既存のHTML要素を拡張するだけで可能とする。[WebSocket](#websocket)や[SSE](#sse)にも対応しているので、チャットアプリなどにも適している。

[2023 JavaScript Rising Stars](https://risingstars.js.org/2023/en)では、 **フロントエンド・フレームワーク**部門で見事2位に輝いた！(一位はReact)　似たような機能として、Ruby on Railsの[HotWire](https://hotwired.dev/)があるらしい。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/

【2024/01/18】今日のキャッチアップ

## チームにいると頼りになるソフトウェアエンジニア

https://nhiroki.jp/2021/04/30/reliable-software-engineers

現在進行系でAIが代替してくれる要素が増えてきているけど、上記で挙げられている役割は今後も求められると感じた。

## プロのデザイナーでも役立つFigma Tips

https://masanori.notion.site/d75c1dad4f53488fb6c5db21225cc4f8?v=10059b0c06a84aa580c00707a22c1193

https://tbdz.notion.site/4ca56d28bd9f4a81809aaa4af9584c57?v=41d260d41ccb4f3a989d2472dcbd9b7d

Figmaを便利に使えるプラグインやTipsがまとめられていて今後活用できそう。

## 初心者向けHTMLリファレンス

https://catnose.me/learning/html/

各HTMLタグの役割を改めて理解する上でとても分かりやすくまとめられており、参

rails勉強2日目

:::note info
インフォメーション
間違いがあるかもしれないです。
:::

## 二日目です
ちゃんと二日目もさぼらずに投稿できてます！！
えらい！！！

## どこまで勉強したのか
progate railsコース2まで終わりました。
## 何を学んだのか
rails consoleを使ったdb導入
“`
rails console
“`
post1に入れたいときは
“`
post1 = post.new(content:”ここに入れたい文字列を導入”)
“`
“`
<% posts.each do |post| %>

<%= post %>

<% end %>
“`
これで@postsに保存されているものが表示されます。

拡大縮小

“`