joppot

コピペで絶対動く。説明を妥協しない

javascript + Reactでhtmlタグの削除と許可とXSS対策

概要 みなさんこんにちはcandleです。今回はReactで許可したhtmlタグだけを表示し、それ以外のタグは削除するプログラムを書いてみます。 注意、本来ユーザーなどが投稿した内容をそのまま表示させ …

React webでreact-simple-formatを使う

概要 みなさんこんにちはcandleです。今回はreactでsimple-formatを使ってみたいと思います。simple-formatは割とRuby on Railsでは有名で、よく使われます。R …

Hiragino Sansフォントウェイトのcss書き方まとめ

2018/12/05   -プログラミング
 ,

概要 みなさんこんにちはcandleです。今回はHiragino Sansのcssの書き方を紹介します。 Hiragino Sansの特徴はフォントの太さを1から9段階まで変えられることです。 一方で …

react-lazyloadを使って画像を遅延ロードをする

概要 みなさんこんにちはcandleです。今回はreact-lazyloadを使って画像の遅延読み込みをしてみましょう。SPAにおける問題は最初の読み込み時の遅さです。その中でも画像が多いサイトになる …

React + S3 + Route53 + CloudFrontでSSL使ってHTTPS化

2018/11/30   -サーバ
 , , , ,

概要 みさんさんこんにちはcandleです。今回はS3にデプロイしたReact webの通信をSSL化してみたいと思います。 最近はAPIサーバとReactフロントエンドを分離してwebサービスを提供 …

S3にホスティングしたReactにRoute53の独自ドメインを割り振る

2018/11/28   -サーバ
 , , ,

概要 みなさんこんにちはcandleです。今回はS3にホスティングしたReactにRoute53の独自ドメインを割り振ってみましょう。 前提 Route53にドメインを持っている S3にドメインと同じ …

Reactをawsコマンドを使ってs3にデプロイする

2018/11/26   -サーバ
 , , ,

概要 みなさんこんにちはcandleです。今回はcreate-react-appで作成したreactプロジェクトをS3にデプロイしてみたいと思います。React webのいいところはbuildして作ら …

Rubyで文字列に含んで欲しくないキーワードがある場合はマッチさせない正規表現

概要 みなさんこんにちはcandleです。今回はRuby主にruby on railsで文字列に含まれて欲しくないキーワードがマッチした場合は通らない正規表現を作りたいと思います。 これは例えばこのよ …

入門ReactでGSAPアニメーションの使い方

概要 みなさんこんにちはcandleです。今回はReactでGSAPを使ってみたいと思います。 簡単にアニメーションが使えるjsライブラリはjQueryが有名です。ただ、jQueryとReactは相性 …

reactで最もシンプルなドロップダウンメニューを作成

概要 みなさんこんにちはcandleです。今回はreactで最もシンプルなドロップダウンメニューを作ってみたいと思います。 前提 Reactの知識がある 準備 以下のコマンドでreactプロジェクトを …

react-modalの背面のスクロールを固定する

概要 みなさんこんにちはcandleです。今回はreact-modalの背面がスクロールした時に動いてしまう問題を解決してみたいと思います。 前提 reactの知識がある 完成版のサンプルコード サン …

react-modalを利用してモーダルを作成するチュートリアル

概要 みなさんこんにちはcandleです。今回はreact-modalを使ってモーダルを作ってみたいと思います。 react-modalはreactで簡単にモーダルを取り扱えるライブラリです。 しかし …


ベンチャー企業のCTOをやってます。大学時代にプログラミングを始め、javaから入門し、C++へて、PHPへと進み、会社ではRailsを使用。自動化が大好きなプログラマー