【Django】canvasで描画した画像をAjax(jQuery)で送信【お絵かきBBS、イラストチャット、ゲームのスクショ共有などに】 - 自動化無しに生活無し
【Django】canvasで描画した画像をAjax(jQuery)で送信【お絵かきBBS、イラストチャット、ゲームのスクショ共有などに】 例えば、チャットサイト、掲示板サイトでユーザーが描画したイラストを投稿できる形式にしたい時。 ユーザーが手元の端末でペイントツールを起動して画像を保存して、サイトに添付して貼り付けるのはやや面倒。それだけでなく、サイト独自のレギュレーション(お題に沿ってイラストを付け加える形式、指定された色しか使ってはいけないなど)がある場合、ユーザーのペイントツールでそれを強いるのは不可能に近い。 そこで、サイト上でイラストが描画できるよう、canvas要素を使用して、Ajax(jQuery)でサーバーへ送信を行う。フロントからサーバーサイドまで一貫性がなければ実現できないので、私が得意のDjangoで実現させ、ここにその方法を記す。 コードは40分の簡易掲示板のコ
初心者向け React入門！その特徴や導入・実装方法について解説｜Udemy メディア
フロントエンド開発に携わるエンジニアにとって、Reactは使い方を習得しておくべきライブラリの一つです。この記事では、Reactの特徴や開発環境の構築、実装方法などについて解説します。 Reactとは ReactはMeta社（旧Facebook社）が作成したJavaScriptライブラリです。2013年にオープンソース化された後は、コミュニティの開発者と共に開発が進められています。 Reactはフレームワークではなく、UI（ユーザーインターフェース）の作成に特化したライブラリです。フロントエンドエンジニアがUIを構築する際に、Reactが活用されます。 Reactは「宣言型」のため、「手続き型」や「命令型」と呼ばれるプログラミング言語よりも効率的にコーディングできる点が特徴です。Reactでデータを更新すると、HTMLの内容も自動で更新されます。jQueryとは異なり、データの更新とHTM
無限スクロールを実装してみる
一定位置までスクロールすると、次のページのコンテンツを自動で読み込む処理を実装してみます。 サンプルコード 今回は以下の5ページ用意しました。 1ページ目 2ページ目 3ページ目 4ページ目 5ページ目 各ページコンテンツの下に次のページへのリンクを配置しています。(5ページ目は次のページがないので外しています。) 1ページ目 <div class="contents"> <ul class="list"> <li class="list__item"> <img src="img/01.jpg" alt="" /> </li> <li class="list__item"> <img src="img/02.jpg" alt="" /> </li> ～ 略 ～ <li class="list__item"> <img src="img/10.jpg" alt="" /> </li> </
JavaScriptで無限スクロールを実装するのはとても簡単（jQuery不要）
ある意味、前回の「JavaScriptとCSSを使ったスライドショーで画像を遅延ロードする方法」と関連するのですが、最後までスクロールしたと思ったら、スクロールバーが増えて画像が追加された！みたいなページってあるじゃないですか。 あれって実は簡単な仕組みで、 最後までスクロールしたのを検出する 次の画像をロードする と、やっていることはただそれだけなので、ついでにこの話もしておこうかなーと思って記事を書いています。もちろん、JavaScriptライブラリやjQueryも使いません。 無限スクロールの実行例 無限スクロールと言いつつホントに無限だとデータ量的に困るので、20枚の写真を用意しました。最後までスクロールすると次の画像が読み込まれるのが確認できるかと思います。 この無限スクロール、技術的に面白いなぁー、というだけの話ではなく、実用面として、 ページを開いた直後は表示されている画像し
【PHP応用】 プロパティ | TECH PROjin
この記事では、プロパティについて、 以下の3点を説明します。 1.プロパティはオブジェクトのメンバ変数。 2.public,protected,privateのアクセス修飾子を指定する。 3.staticキーワードをつけると、インスタンス化せずに使うことができる。 プロパティとは オブジェクトのメンバ変数です。 「人間」クラスのプロパティは 「名前」「体重」「身長」などが考えられます。 ★他の例も考えてみましょう。 プロパティへのアクセス方法 オブジェクトのプロパティへアクセスする構文 オブジェクト変数->プロパティ名; ハイフンと大なり記号を組み合わせた 矢印(arrow)のような形をした「アロー演算子」を用いて、 オブジェクト内のプロパティにアクセスできます。 ※後に出てきますが、アクセスできることが条件になります。 ※JavaやPythonなどと違い、ドット演算子ではアクセスできませ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
