joppot

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

「 javascript 」 一覧

React WebでURLをaタグのリンクにして表示する

概要 みなさんこんにちはcandleです。今回はReactでコメントなどに投稿されたURLからリンクを生成する方法を紹介します。しかし、URLからリンクの自動生成は結構危険です。無尽蔵にリンク化を許可 …

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

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

React webでreact-simple-formatを使う

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

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

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

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

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

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

入門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で簡単にモーダルを取り扱えるライブラリです。 しかし …

ReactでFaker.jsを利用してダミーデータを生成する

概要 みなさんこんにちはcandleです。今回はFaker.jsをReactで使ってみようと思います。 Faker.jsの使用目的は様々あると思います。多くの場合はテストで使うと思うのですが、今回は簡 …

Chart.js 2.0でy軸の最大値(scales max)と最小値を設定する

概要 みなさんこんにちはcandleです。今回はChart.js2.0でy軸の最大値、最小値を設定する方法を紹介します。 Chart.js 2.0では特に指定しないと自動的に、y軸の最大値を設定してく …

railsのcoffee scriptをurl判定をして実行をする方法

概要 みなさんこんにちはcandleです。 今回はcoffeescriptを任意のURLで実行する様にする関数を作ります。 というのはrailsは最終的にassetspiplineでjavascrip …


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