フォームのバリデーションに役立つYupとは? React向けライブラリを解説

フォームのバリデーションに役立つYupとは? React向けライブラリを解説 サムネイル

今回は「フォームのバリデーションに役立つYupとは? React向けライブラリを解説」についてご紹介します。

関連ワード (.NET、C++、CodeZine、Java、VB、Windows、ソースコード、プログラミング、開発等) についても詳細と、関連コンテンツとをまとめていますので、参考にしながらぜひ本記事について議論していってくださいね。

本記事は、CodeZine様で掲載されている内容を参考にしておりますので、より詳しく内容を知りたい方は、ページ下の元記事リンクより参照ください。


対象読者

  • JavaScriptとWeb開発の基礎に理解がある方
  • Reactを用いたJavaScriptアプリケーション開発の経験者

前提環境

 筆者の検証環境は以下の通りです。

  • macOS Big Sur 11.1
  • Node.js 15.5.0/npm 7.3.0
  • React 17.0.1
  • react-scripts 4.0.1
  • Formik 2.2.6
  • Yup 0.32.8

バリデーションを宣言的に記述する

 今回はフォームのバリデーションに役立つライブラリ、Yupについて解説します。前回解説した、フォーム作成補助ライブラリのFormikでは、入力内容のバリデーションをリスト1のように記述していました。

[リスト1]Formikの素直なバリデーション
  <Formik    validate={values => {      const errors = {};      if (!values.email) {        errors.email = 'Eメールを入力してください'      }      return errors;    }}  >  

 validate属性の関数に、すべての入力欄の値が入ったオブジェクトであるvaluesが渡されるので、それの正否を判定し、もし誤りがあればvaluesオブジェクト内の項目名と同名のキーでerrorsオブジェクトにエラーメッセージを登録することになっていました。データに対してif文を駆使しながら1行ずつ処理を書いて判定してするので、いわゆる手続き的プログラミングの手法でバリデーションルールを実装することになります。

 UIの操作はReactのおかげで宣言的に記述できるようになっています。可能であれば、バリデーションルールの定義も宣言的プログラミングで行いたいですよね。そんな夢を叶えてくれるのが、Yupというバリデーション専門のライブラリです。Yupが生成するバリデーションルールはFormikでも公式サポートされているので、前回の内容と組み合わせることで、より快適にフォームを組み上げられることでしょう。

Yup

 YupはJason Quense氏が開発している、バリデーションのためのライブラリです。

  • https://github.com/jquense/yup
図1:YupのGitHubリポジトリ
図1:YupのGitHubリポジトリ

 GitHubのREADME(説明書)には、Yupは”JavaScript schema builder for value parsing and validation”である、と書かれています。フォームの入力値を解析してバリデーションを行うために、JavaScriptでスキーマ(データ構造)を定義するためのライブラリである、ということです。ただ、スキーマと言われてもピンとこないと思うので、実際の例を見てみましょう。スキーマはリスト2のように、関数のチェーン呼び出しを組み合わせながら定義します。

[リスト2]スキーマを定義する
  import * as yup from 'yup';    const schema = yup.object().shape({ // (1)    name: yup.string().required(), // (2)    age: yup.number().required().positive().integer(), // (3)    email: yup.string().email(), // (4)  });  

 (1)のyup.object()は、判定対象の入力値がオブジェクトで提供されることを期待する定義です。続いて、実際のデータ構造を.shape()で定義します。(2)はnameという項目が文字列型の必須項目であることを示しています。(3)はageという項目が数値型の必須項目であり、正の整数であることを期待する定義です。(4)はemailという項目が文字列型であり、メールアドレスとして正しい形式であることを期待する定義です。emailにはrequired()が付いていないので、任意入力の項目です。

 Yupのスキーマ定義は、このように各項目の特性を並べるだけで作成できます。バリデーションルールを宣言的に記述できる、魅力的なインターフェースですね。

 さて、本来はフォームに組み込んで使うライブラリですが、単独で動作させるためのインターフェースも用意されています。リスト2のスキーマを使って値を検証する場合は、リスト3のような書き方になります。

[リスト3]Yup単独でバリデーションを実行する
  schema    .isValid({ // (1)      name: 'Taro',      age: 24,    })    .then(function (valid) { // (2)      // ...    });  

 Yupのスキーマオブジェクト(リスト2で作成したschema)には、データを検証するための関数として(1)のisValidが用意されています。スキーマの最上位のデータ型としてobject()を定義していたので、isValidに渡すデータもオブジェクトです。バリデーションは非同期で行われ、Promiseで返却されます。(2)のように.then()にコールバック関数を登録することで、入力値の正否をboolean型で受け取れるので、これを受けて次の処理を実施することになります。これがYupの最もシンプルな使い方です。

任意のエラーメッセージを扱う

 さて、ここまでの解説では、エラーメッセージを定義する場所も受け取る場所もありませんでした。エラーメッセージを受け取りたい場合は、isValid()の代わりにvalidate()を使います(リスト4)。

[リスト3]Yup単独でバリデーションを実行する
  schema    .validate({      name: 'Taro',      age: 'hi', // 数値型ではなく文字列型を渡している    })    .then(function (value) { // (1)      // ...    })    .catch(function (err) { // (2)      console.log(err.errors); // => ['age must be a number']    });  

 validate()を使った場合は、isValidのときと比べて挙動が変わります。成功した場合である(1)の.then()には、検証対象だった値(validate()の第一引数)がそのまま渡されます。一方、失敗した場合である(2)の.catch()には、エラーメッセージの配列が渡されます。ようやくここでエラーメッセージを見ることができました。

 エラーメッセージが英語で記載されているのが気になりますが、これはカスタマイズできます。スキーマを定義する時点で、各条件の関数に引数として文字列を渡すと、バリデーションエラーが起きたときにエラーメッセージとして利用されるのです(リスト4)。

[リスト4]エラーメッセージをカスタマイズする
  import * as yup from 'yup';    const schema = yup.object().shape({    name: yup.string().required('名前は必須項目です'),    age: yup.number('年齢は数値で入力してください') // (1)      .required('年齢は必須項目です')      .positive('正の数を指定してください')      .integer('整数で指定してください'),    email: yup.string().email('メールアドレスの形式が不正です'),  });    schema    .validate({      name: 'Taro',      age: 'hi', // 数値型ではなく文字列型を渡している    })    .catch(function (err) {      console.log(err.errors); // => ['年齢は数値で入力してください'] // (2)    });  

 リスト2のスキーマ定義に少し手を加えて、各条件にメッセージを登録しました。(1)でageが数値ではなかった場合のメッセージを登録しています。これはリスト3の例と同様にエラーになり、(2)には(1)と同じ文字列がエラーメッセージとして渡されてきます。このように、日本語のエラーメッセージを扱うことも可能です。

 エラーメッセージを登録し忘れると、画面に英語のメッセージが出てくることになるので、業務で利用する場合には注意が必要かもしれません。

7つのデータ型

 Yupは入力項目の特性を宣言的に記載することでスキーマを組み立て、バリデーション処理を実施できるライブラリだということをここまでに解説しました。次は、Yupでどんなデータをバリデーションできるのかを見ていきましょう。Yupが取り扱うデータ型は、大別すると7つに分類できます。

  • mixed:共通データ型
  • string:文字列型
  • number:数値型
  • boolean:真偽値型
  • date:日付型
  • array:配列型
  • object:オブジェクト型

 共通データ型ジャンルの関数群だけは少し特殊で、どんなデータ型にも当てはまるrequired()関数などが当てはまります。他のデータ型については「本当にそのデータ型の値が入力されたか」がチェックされ、その上で「大きい、小さい」「長い、短い」などの条件がチェックされることになります。それでは、フォーム実装でよく使う項目を中心に、どんな条件付けができるのかを見ていきましょう。

mixed:共通データ型

 mixed()でスキーマを作った場合、その項目はすべてのデータ型を受け入れます。例えば、リスト5のようにundefinedを入力値として渡しても、バリデーションが成功します。

[リスト5]mixedはどんなデータ型でも受け入れる
  const schema = yup.mixed();    schema.isValid(undefined, function (valid) {    valid; // => true  });  

 何らかの理由で複雑なデータ型をフォームで扱うことになり、データ型のチェックをしたくない場合にmixed()を利用するとよいでしょう。またmixed()に付けられるバリデーション条件は、他のすべてのデータ型に同じものを定義できるので、汎用性が高いものになっています。

  • required():必須項目である
  • default(any):入力値がない場合のデフォルト値を指定する
  • oneOf(array):複数の項目のうちどれか1つならばOK

 required()は、これまでの解説にも出てきた通り、フォームのUIに頻出する必須項目を扱います。default()は、入力項目がundefinedだった場合にデフォルト値を割り当てるために利用します。validate()関数が成功したときに渡される値は元の入力値そのままではなく、このdefault()で割り当てた値で置き換えることもできるということです。oneOf()は、事前に定義した1つまたは複数の値に入力値が含まれているかをチェックする、少しユニークな条件です。リスト6のように使います。

[リスト6]oneOf
  const schema = yup.mixed().oneOf(['jiro', 10]); // (1)    await schema.isValid(10); // => true // (2)  await schema.isValid('jiro'); // => true // (3)  await schema.isValid(new Date()); // => false // (4)  

 (2)と(3)の値は(1)の配列に含まれているので、バリデーションで正常と判定されます。一方、(4)はDate型の値なのでエラー扱いとなります。ドロップダウンなどの選択式のUIで、入力値の候補がいくつかに絞られる場合には、有効な選択肢となるでしょう。

string:文字列型

 string()で作ったスキーマは入力値を文字列としてチェックします。文字列は入力フォームにとって最も基本的なデータ型なので、チェック項目も多様です(リスト7)。

[リスト7]stringに指定できる条件
  // 文字列ならOK  await yup.string().isValid('こんにちは'); // => true  // 必須入力  await yup.string().required().isValid('hi'); // => true  // 必須入力の場合に空文字は不正となる  await yup.string().required().isValid(''); // => false  // 指定した文字数以外だとエラー  await yup.string()    .length(5, '入力値は5文字ちょうどで入力してください').isValid('aaaaaa'); // => false  // 指定した最小文字数より小さいとエラー  await yup.string()    .min(5, '入力値は5文字以上にしてください').isValid('aaa'); // => false  // 指定した最大文字数より大きいとエラー  await yup.string()    .max(5, '入力値は5文字以下にしてください').isValid('aaa'); // => true  // 正規表現にマッチしなければエラー  await yup.string().matches(/(dog|cat)/).isValid('bird'); // => false  // メールアドレスの仕様に沿っていなければエラー  await yup.string().email().isValid('aaaa@example.com'); // => true  // URLの仕様に沿っていなければエラー  await yup.string().url().isValid('https://example.com'); // => true  

 入力文字数に関するバリデーションは特に重宝するので、覚えておくとよいでしょう。

number:数値型

 number()で作ったスキーマは入力値を数値としてチェックします(リスト8)。

[リスト8]numberに指定できる条件
  // 数値ならOK  await yup.number().isValid(10); // => true  // 指定した最小値より小さいとエラー  await yup.number().min(5).isValid(3); // => false  // 指定した最大値より大きいとエラー  await yup.number().max(5).isValid(5); // => true  // 指定した最大値以上だとエラー  await yup.number().lessThan(5).isValid(5); // => false  await yup.number().lessThan(5).isValid(4); // => true  // 指定した最小値以下だとエラー  await yup.number().moreThan(5).isValid(5); // => false  await yup.number().moreThan(5).isValid(6); // => true  // 正の値ならOK  await yup.number().positive().isValid(5); // => true  // 負の値ならOK  await yup.number().negative().isValid(-5); // => true  // 整数ならOK  await yup.number().integer().isValid(1.1); // => false  

 数値の境界値チェックに便利な条件が整備されていますね。

boolean:真偽値型

 boolean()で作ったスキーマは入力値を真偽値としてチェックします(リスト9)。

[リスト9]booleanに指定できる条件
  // 真偽値ならOK  await yup.boolean().isValid(true); // => true  

 boolean()は2値しかないので、バリデーションルールは特に整備されていません。

date:日付型

 date()で作ったスキーマは入力値を日付型としてチェックします(リスト10)。

[リスト10]dateに指定できる条件
  // Date型ならOK  await yup.date().isValid(new Date()); // => true  // ISO8601形式の文字列でもOK  await yup.date().isValid('2020-12-24T03:17Z'); // => true  // 指定した日付以降ならOK  await yup.date().min('2020-12-23').isValid('2020-12-24'); // => true  // 指定した日付以前ならOK  await yup.date().max('2020-12-23').isValid('2020-12-22'); // => true  

 日時の範囲を指定できるのは便利ですね。

array:配列型

 array()で作ったスキーマは配列で渡された入力値の集合についてチェックします(リスト11)。

[リスト11]arrayに指定できる条件
  // 配列ならOK  await yup.array().isValid([1, 2]); // => true  // 他のデータ型で縛ることもできる  await yup.array(yup.string()).isValid(['a', 'b']); // => true  await yup.array(yup.string()).isValid([1, 2]); // => false  // 配列が指定した長さではない場合にエラー  await yup.array().length(5).isValid([1, 2]); // => false  // 配列が指定した長さより小さい場合にエラー  await yup.array().min(5).isValid([1, 2]); // => false  // 配列が指定した長さより大きい場合にエラー  await yup.array().max(5).isValid([1, 2]); // => true  // 配列内の値もチェックできる  await yup    .array(yup.number().min(2)).isValid([1, 2]); // => false (2より小さい数値が含まれているため)  

 複数回答を許可しているフォームなどで威力を発揮する機能ですね。

object:オブジェクト型

 object()で作ったスキーマはオブジェクトで渡された入力値の集合についてチェックします。Formikをはじめとして、フォームの入力値をデータとして表現する場合にはオブジェクトの形になることが多いため、スキーマの最上位のデータ型として重宝します(リスト12)。

[リスト12]objectでデータ構造を定義する
  // shapeで項目ごとのチェック条件を定義できる  yup.object().shape({    name: yup.string().required(),    age: yup.number().required().positive().integer(),    email: yup.string().email(),  });  

 オブジェクトで最上位のデータ構造を定義し、個別のデータ構造はstring()number()で定義するのがよくあるスタイルになります。

Formikと組み合わせる

 最後に、Formikと組み合わせるための方法を確認しておきましょう。前回Formikで作成した申し込みフォームのプロジェクトに、npmでYupをインストールします(リスト13)。

[リスト13]yupをインストールする
  $ npm install yup --save  

 次に、Yupでスキーマを作成して、Formikに設定します(リスト14)。

[リスト14]FormikとYupを併用する
  import * as yup from 'yup';    function App() {    // (1)    const validationSchema = yup.object().shape({      email: yup.string()        .email('Eメールアドレスの形式が不正です')        .required('Eメールアドレスを入力してください')    });      const formik = useFormik({      initialValues: {        email: '',      },      validationSchema: validationSchema, // (2)      onSubmit: (values, { setSubmitting }) => {        postData(values)        .then(() => {          alert('送信完了しましたn' + JSON.stringify(values, null, 2));          setSubmitting(false);        });      },    });  

 (1)でyup.object()をベースにしてスキーマを定義しています。入力欄としてemailがあるので、チェック内容もyup.string().email().required()にしました。これで、必須チェックだけではなく、メールアドレスとしての形式チェックも簡単に導入できました。スキーマが出来上がったら、(2)のように、FormikのvalidationSchemaプロパティにスキーマを設定します。validateプロパティは削除して構いません。これだけでFormikとYupのつなぎ込みは完了です。

 それでは動作確認です。まずは、メールアドレスではない値を入力してみましょう(図2)。

図2:メールアドレスではない値を入れた
図2:メールアドレスではない値を入れた

 前回なら入力値ありで通ってしまっていたバリデーションでしたが、今回はメールアドレスの形式チェックが入ったので、エラー扱いになりました。今度は正しい形式のメールアドレスにしてみましょう(図3)。

図3:メールアドレスとして正しい値を入れた
図3:メールアドレスとして正しい値を入れた

 エラーメッセージが消えました。Yupはちゃんと動いているようです。

まとめ

 フォームの各項目の特性を宣言的に定義するだけで、バリデーションルールの実装ができるようになりました。FormikやYupを駆使して、堅牢なフォームを作っていきましょう。さて、次回はReactに特化した通信ライブラリとして、SWRについて解説します。お楽しみに。

プログラミン | 文部科学省

なお、小学校プログラミング教育に活用できるプログラミング言語や教材については、「小学校を中心としたプログラミング教育ポータル」において実践事例とともに掲載していますのでそちらをご参照く …

プログラミング - Wikipedia

コンピュータープログラミング ( 英語: Computer Programming )とは、ある特定の コンピューティング の結果を得ることを目的として、 実行可能 な コンピュータープログラム を設計・構築するプロセスのことである。. プログラミング が関係するタスクの例としては、アルゴリズムの生成、アルゴリズムの正確さとリソースの消費量のプロファイリング、選択した ...

【2020年最新版】今学ぶべきプログラミング言語ランキング ...

 · C#は、Visual Studio ユーザーにとって大変役立つプログラミング言語になります。. C# が使えると、Visual Studioベースで Web や iOS や Androidのアプリ開発をバリバリ行うことができます。. ちなみに C# は、C と付きますが C/C++ とは全く異なる言語で、Microsoft 社が独自に開発したプログラミング言語になります。. C# は、Microsoft や Google が参加する .NET Foundation にて管理・運 …

Scratch Studio - Scratchではじめよう!プログラミング入門

 · Scratchではじめよう! プログラミング入門 Scratch 3.0版(日経BP社) 書籍に掲載されているプロジェクトの完成例を掲載しています。各ステージのプロジェクトをクリックして閲覧してください。 Scratch 2.0の『Scratchではじめよう!

【2020年】プログラミング言語ランキング!日本と世界で人気 …

急速に発展する現代のテクノロジーによって私たちの暮らしは日々豊かになっています。そんな私たちの暮らしを陰で支えているテクノロジーの1つとしてプログラミング言語が挙げられます。LINEやTwitterといったSNS、Youtubeといった動画配信サービス、さらにはAmazonなどのオンラインショッピングサービスなど身の回りのサービス全般はこれらのプログラミング言語によって記述されたシステムで機能しています。今回はこのプログラミング言語を日本国内及びグローバルな観点からランキングをご紹介します。

プログラミング初心者入門講座

プログラミングに興味を持ちはじめた初心者、将来プログラマーになりたいという未経験者を対象にした、無料で学べるWeb講座です。プログラミングの基礎やデータベースの基礎を短期間で身に付けて、プログラミングをあなたの仕事に活かしてください。

プログラミング学習に小学生無料のサイト&アプリ5選! [小学 …

小学生無料のプログラミング系学習サイト&アプリをご紹介します。新型コロナウイルス感染防止のため休校が続き、家で過ごす時間が多くなった子どもたちのために続々登場している、無料で利用できる学習支援サイトを活用しましょう!

プログラミングを独学で習得する!未経験者でもわかりやすい ...

 · プログラミングの学習を始める前に、まずは「プログラミングで何がしたいのか」という目的を明確にしましょう。 たとえば「iPhoneの みたいなアプリを作る」や「自分が考案したWebサービスを作る」「3Dゲームを開発したい」など、プログラミングを習得する目的は人によってさまざまです。

ゲームで遊ぶようにプログラミングを学べるサービス10選 ...

初心者でもゲーム感覚でプログラミングを学べる無料サービスを厳選して紹介する記事です。「アナと雪の女王」など子どもが興味を持ちそうな題材のサービスから、RubyやPHPなど20のプログラミング言語を学べるサービスまであります。

プログラミングとは何か?初心者にもわかりやすく説明しまし ...

プログラムを作るのがプログラミングです。

株式会社札幌リゾート開発公社 札幌国際スキー場、豊平峡ダム ...

Copyright (c) 2007 Sapporo Resort Development co.,ltd. All Rights Reserved.

Sota's Web Page

私のウエブページへのリンクはご自由にどうぞ。連絡は必要ありません。 トップページ以外へのリンクもOKですが、ファイル名が変わることがあります。 左上のバナーもご自由にご利用ください。 (リンクはもともと自由なものですが、許可を求めてこられる方がおられますので書いており ...

まとめたニュース : Windowsのソースコードが6200万円で売り …

Windowsのソースコードが6200万円で売りに出されていることが発覚 1 : [sage] :2021/01/14(木) 15:33:22.09 ID:OxTYJAXQ02020年12月に発生した、ネットワーク監視ソフト「Orion Platform」への大規模なサイバー攻撃により、アメリカの ...

SMBCソースコード漏洩の警鐘――サイバーセキュリティ後進 …

三井住友銀行などのソースコードが漏洩し、一部が公開された問題は、サイバーセキュリティ後進国としての課題だけでなく、産業革命の時代にさかのぼる抵抗の現代版を誘発しかねないリスクをも浮き彫りにした。

Visual Basic .NET (VB.NET) のサンプル

Visual Basic .NET (VB.NET) のサンプルコード (Tips) を提供しています。

GraphQL .NET

GraphQL .NET ... GraphQL .NET

楽譜が無料!GLNET+

GLNET+では、楽譜の再生機能及び、楽譜の表示にAdobe社のFlashという技術を利用しておりますが、技術的な問題により、現在、サービスを停止しております。 楽譜の再生機能はGLNET+最大の売りであり、早期の問題解決に向け努力して ...

Visual Basic .NET (VB.NET) - すべてのサンプル

Visual Basic .NET (VB.NET) のサンプルコード (Tips) を提供しています。

anime.net

anime.net

URL変更のお知らせ

いつも当社ウェブサイトをご覧いただきまして誠にありがとうございます。 当社ウェブサイトは2009年10月7日にリニューアル を実施いたしました。 ※リニューアルに伴いましてURLを変更いたしましたのでお気に入り登録を

[ポイントサイト]お小遣いを貯めるなら安心 ... - お財布.com

ポイントサイトのお財布.comは、2020年01月31日(金)12:00をもって『お財布.com』のすべてのサービスを終了させていただきました。これまで賜りました皆様のご愛顧に、心より感謝申し上げます。

Jamaican Dominoes - EyeGrid

Jamaican Dominoes made in Flash by EyeGrid EyeGrid:: Games:: Jamaican Dominoes

ライブチャット比較ランキング【2020年版】

人気ライブチャットの中から、おすすめのサイトをランキングTOP5にまとめました。ライブチャット比較にぜひご活用ください。

GMX Grußkarten

Versenden Sie kostenlose Grußkarten! Elektronische Grüße (Ecards) zu verschiedenen Anlässen: Geburtstag, Einladung, Weihnachten, Neujahrswünsche, Valentinstag, Glückwünsche. Zudem animierte Motive und vieles mehr! Versenden Sie die online GMX Grußkarten per E-Mail bequem an Ihre Kontakte. Nutzen Sie diesen Service am PC und auch über Ihr mobiles Endgerät bzw. Handy.

Windows清理助手 -Windows清理助手官方网站 – 系统清理 ...

Windows清理助手能对我们已知的木马和恶意软件进行彻底的扫描与清理。提供系统扫描与清理、在线升级功能。独特的清理方式,使清理助手能轻易对付强行驻留系统、变名等一系列恶意行为的软件。 同时在高级功能中包括:微软 ...

フリーソフト Windows - MARINECAT

午後のこ~だ for Windows Ver3.13a のダウンロード (3,845,330byte) 以下のソフトウェアにて、午後のこ~だのエンコードコアであるGOGO.DLL もしくは Win32コンソール版 のGOGO.EXEを使用できるという報告を頂いております。

Windows Update

Find Windows Update using your Start Screen. Windows Update is included in the Control Panel.

Microsoft Windows Update

Windows Update is included in Control Panel. To check for updates: To check for updates: Click the Start button, click All Programs , and then click Windows Update .

Microsoft Windows Update

Get the latest updates available for your computer's operating system, software, and hardware. We will scan your computer and provide you with a selection of updates tailored just for you.

@MARINECAT

ウィルス誤検出について、解決したとのソースネクスト社より回答がありました。対処方法はこちら。 2008/04/23 ウィルス誤検出について、ソースネクスト社より回答がありました。暫定対処方法はこちら。 (当方該当ソフトを持っていないため試していません)

Windows · libusb/libusb · GitHub - GitHub: Where the world ...

A cross-platform library to access USB devices . Contribute to libusb/libusb development by creating an account on GitHub.

Opera Web Browser | Faster, Safer, Smarter | Opera

詳細の表示を試みましたが、サイトのオーナーによって制限されているため表示できません。

Rioters break windows and breach US Capitol - CNN Video

 · Rep. Jim Himes (D-CT) describes tense moment inside Congress building as rioters breach the US Capitol in protest of the 2020 election.

Adobe Inc.

詳細の表示を試みましたが、サイトのオーナーによって制限されているため表示できません。

COMMENTS


3930:
2021-02-12 01:14

#さみしすぎて会いたい人たち ・幸 ・唯憑 ・💛🦊光阪 京香(光ちゃん)⛩💛 ・TeamCRonaldo ・マミィ🖤ストロングゼロ堕天使👿 ・I氏の隣人▲いちゃん ・黒。 ・🌹V系ロック.net🌹 ・yurina 【京虜……

Recommended

TITLE
CATEGORY
DATE
広がるローコード開発–「次の段階に進む」とOutSystems
IT関連
2021-02-10 21:37
ITエンジニア本大賞2021のベスト10が発表! 大賞を決めるプレゼン大会を2/18に開催予定
IT関連
2021-01-22 17:29
創業者の「悪夢」、インシュアテックSureはベンチャー支援者が模倣企業設立、出資したと主張
ネットサービス
2021-02-22 08:16
Apple、「iPhone 12」はペースメーカーなどから15センチ以上離すようサポートページで注意喚起
企業・業界動向
2021-01-26 10:36
コード不要でさまざまなeコマースツールを利用可能にするPipe17が約8.5億円調達
ソフトウェア
2021-02-23 13:04
小学生向け「鬼滅の刃」無料ドリル、応募受付再開 30万人→60万人に拡大 進研ゼミ
くらテク
2021-02-17 22:07
サイバー攻撃で不正にアクセスされたコロナワクチン情報の一部が流出–欧州医薬品庁
IT関連
2021-01-15 03:37
業界最先端の動画制作テクニックを制覇!Adobe Premiere Pro オンライン講座
Udemy
2021-01-15 03:37
新型コロナワクチン接種のビル・ゲイツ氏長女「残念ながら父の才能チップは移植されなかった」と投稿
IT関連
2021-02-16 11:55
ソーシャルゲームZyngaのCEOがさらなる買収計画を語る
ゲーム / eSports
2021-02-12 09:30
「ペネトレーションテスト」 ~マンガでプログラミング用語解説
IT関連
2021-02-02 14:39
コロナ患者191人分の氏名が埼玉県の公式ページで一時閲覧できる状態に 県が謝罪
社会とIT
2021-01-27 16:18
「失神チャレンジ」による少女死亡事件でTikTokのイタリア当局への対応に注目
ネットサービス
2021-01-27 01:15
SBテクノロジー、ゼロトラストセキュリティ短期構築サービスを開始
IT関連
2021-02-02 16:20
「Wijmo(ウィジモ)」とElectron、Reactに、TypeScriptを組み合わせてスムーズなアプリ開発を実現
IT関連
2021-01-14 09:12
みんなのAI講座 ゼロからPythonで学ぶ人工知能と機械学習
Udemy
2021-01-14 09:12