toLocaleDateStringで簡単に日付フォーマット これまで日付フォーマットする時って、getFullYear()とかgetMonth() + 1とかで頑張ってフォーマットしていたんですけど、toLocaleDateString()を使う方法を知り、備忘録として取り上げました。 toLocaleDateString()は、 Dateオブジェクトが持つ日付と時刻の値を、指定したロケールの形式で文字列として返します。 構文
【JavaScript】toLocaleDateStringで日付フォーマット 🗓 - Qiita
toLocaleDateStringで簡単に日付フォーマット これまで日付フォーマットする時って、getFullYear()とかgetMonth() + 1とかで頑張ってフォーマットしていたんですけど、toLocaleDateString()を使う方法を知り、備忘録として取り上げました。 toLocaleDateString()は、 Dateオブジェクトが持つ日付と時刻の値を、指定したロケールの形式で文字列として返します。 構文
Prismaの導入とメリットを考える - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? はじめに Node.js + TypeScriptによるサーバーサイドの開発は、クライアントサイドとスクリプトを同じ言語で管理できるなどのメリットがあります。 その際に使用するのが、Node.jsウェブフレームワークであり、データベース連携は必要不可欠です。 ですが、普段データベースに触れる機会が少ないデータベース初心者にとって、SQL文を書くのはハードルが高く感じます。 そういった状況で役に立つのが、「Object-Relational Mapping / オープンソースのオブジェクト関係マッピング」(以降ORM)です。 「Prism
YarnV2 こと Yarn@berry を試してみている - Qiita
Yarn とは yarn とは雑には alternative npm。高速な Node.js 向けのパッケージマネージャ。 package.json を解釈し、高速にパッケージの依存解決を行ってくれる。 Yarn V2 のインストール方法 Yarn v2 は現状 yarn@berry としてバージョンを指定することでインストール可能。 V1 と V2 の違い 一次情報はこちらのエントリを参照のこと。スクショは公式から引用。 https://dev.to/arcanis/introducing-yarn-2-4eh1 個人的に特に気になっているものに 🍎 (赤いリンゴ) をつけておく。 色々途中なので変化したり間違ってる部分はご容赦ください。 🍏 CLI出力の改善 yarn v1 では絵文字が使われて可愛らしい出力だったが、v2 からは処理の具体的な内容を表示するように変化した。 色はア
【JavaScript】Babelとは何か - Qiita
プログラミング勉強日記 2021年1月8日 TwitterでBabelの存在を知ったので、Babelとはいったい何なのか気になり調べてみた。 Babel(読み方：「バベル」)は、次の世代のJavaScriptの標準機能をブラウザのサポートを待たずに使えるようにするNode.js製のツールである。次の世代の標準機能を使って書かれたコードを、それらの機能をサポートしないブラウザでも動くコードに変換する。 簡単に言うと、JavaScriptのコードを新しい書き方から古い書き方に変換するツールである。具体的には、JavaScriptの言語仕様であるES2015以上の仕様のJavaScriptで記述すると、Internet Explorer11といった古いブラウザでは動作しない。そこで、Babelを使ってES2015・ES2016といった仕様で記述したJavaScriptファイルを互換性のあるEXM
JavaScriptの非同期処理をしっかり理解する 〜async/await/Promise〜 - Qiita
JavaScript での非同期処理について、身近な例や具体例を交えながら詳細に解説しています。 最後には練習問題も用意しています！ 頑張って書いているので、良いと思ったらコメント・いいね・ストック・共有などしてもらえると嬉しいです！！ 非同期処理とは 非同期処理とは、プログラムの処理が順番に実行されず、ある処理を実行している間に他の処理を並行して実行することができる仕組みです。非同期処理では、あるタスクが完了するのを待たずに次のタスクが実行されるため、効率的に複数の処理を進めることが可能です。 （by ChatGPT） 非同期処理とは、「同期処理」の対義語で、同期処理は「プログラムの処理が順番に実行され、ある処理が終わるまで次の処理を待つ仕組み」です。 非同期処理の最大のメリットは、 「時間のかかる処理を行っている間に別の処理を行うことができる」 ことです！ 身近な例では、部下への仕事の
MUI (Material-UI) v5でmakeStylesが非推奨になったのでstyledを使ってみる - Qiita
Material UI v5が2021年9月16日にリリースされ、makeStylesが非推奨になってしまいライブラリをアップデートするためにmakeStylesからstyledに置き換え対応を行いました。 これからv4からv5への移行をこれから行う人のためになればと思いサンプルコードを使って記事にしました。 Material-UI v4 の記法サンプル 実際に行った作業 MUI v5のライブラリを追加 import先の変更 styledを使ったコンポーネントへのスタイリングの適用 完成品 置き換えをした感想 最後に Material-UI v4 の記法サンプル makeStylesを使用して自作hooksを作成して、各コンポーネントにclassNameをあてているDialogになります。 import { makeStyles, createStyles } from '@materia
Local Storageを使ってみる - Qiita
Local Storageとは Local StorageとはHTHL5から導入されたWEB APIの一種で、Javascriptでブラウザにデータを記録する仕組みです。 利点 ブラウザにデータを保存できる cookieのようにWEBサーバーにデータを保存するのではなくブラウザに保存するので、 ブラウザを閉じてもユーザーの入力情報などを保持し続けることができます。 保存容量が大きい 主要なブラウザなら5MBまでデータを保存できます。 注意点 データは永続的に保存される こちらでLocal Storageのデータを削除する処理を書かないと、データは永続的に残り続けるので削除する処理を書きましょう。 Javascriptから自由にアクセスできる セキュリティ上非常に大きな注意点です。 ユーザーの個人情報など、機密性の高い情報には使わないようにしましょう。 構文 保存 localStorage.
「JavaScriptで要素をドラッグして移動する簡単な方法」という記事が初耳だらけだった件 - Qiita
はじめに まず↓の記事を見てない方はぜひ見てください！ 自分にとってはこの記事には「えっ、ナニコレ！」なテクニックが多く、特に解説もなかったのでいろいろ調べてたら休日が消えてました... なのでその時間の供養もかねて、自分が知らなかった部分を中心に、僭越ながら元記事の解説を書いてみたいと思います。 ちなみに、以下が元記事のコードそのままを実装したものです。たしかに掲載コードだけで要素がグリグリ動きますね。 See the Pen js-drag-move-original by www-tacos (@www-tacos) on CodePen. 初耳1: $img まずコードのここ
console.log() の代わりにdevtoolsのLogpointsを使う - Qiita
Logpointsを使おう Webフロントエンドの開発をする際、デバッグ目的で「特定の処理が実行された」ということを確認するために console.log() を使うことは多いと思います。しかし、Google Chrome や Microsoft Edge で利用可能な Logpoints を利用することで、 console.log() を使わずともコンソールにメッセージを出力することが可能です。 なぜLogpointsを使うの？ Logpoints を使うのには以下のメリットがあります。 デバッグや動作確認のためにコードを変更する必要が無い console.log() を誤ってcommitに含めてしまう心配が無い console.log() を入れた後に再ビルドやホットリロードを待つ必要が無い どうやってLogpointsを使うの？ logpoints は以下のように使用します。 Chr
awaitできるsetTimeoutを1行で書く方法 - Qiita
await new Promise(resolve => setTimeout(resolve, 3000)) // 3秒待つ // ... 3秒後の処理 ... // よくある長めの実装 const sleep = () => new Promise(resolve => { setTimeout(() => { resolve() }, 3000) }) await sleep() // ステップ1: () => { resolve() } は resolve に短縮する const sleep = () => new Promise(resolve => { setTimeout(resolve, 3000) }) await sleep() // ステップ2: resolve => {} は resolve => に短縮する const sleep = () => new Prom
GoogleAppsScriptは何で書くべきか(公式orローカル / JSorTS ) - Qiita
初めに ライブラリ等でメリットデメリットが大きく変わってくるため、 大雑把になっています GoogleAppsScriptを書く手段 公式サイトで作成する 公式エディタ(https://script.google.com)でJavaScriptで記載する ローカルで作成する(EditorはVSCode) JavaScriptで記載し、そのままclaspでpushする TypeScriptで記載し、そのままclaspでpushする(自動でトランスパイルされる) JavaScript/TypeScriptで記載し、webpack等を使ってビルドして、claspでpushする それぞれのメリット・デメリット 公式エディタを使って、JavaScriptを使う メリット ライブラリ,サービスの使用やデプロイを、GUIで書ける JSDocで型を記載できる(paramとreturnしか使えない) 一応G
ほぼ毎日Qiitaを２時間見る私が、特に好きな記事をまとめてみた - Qiita
前書き 5か月ほど前にQiitaに登録し、それから登下校中や休憩時間など、空いた時間は基本Qiitaを見るようになりました。 ストックした記事が106、LGTMした記事が12ページ分にもなり、記事の整理もかねて、特に好きな記事や理解が深まった記事などを振り返りつつまとめようと思います。 無言で記事を掲載しております。迷惑だったら申し訳ありません。 が、随時更新予定です。 追記(2022/10/18) Twitterにておすすめの記事を紹介していただきました！ 今後もそういった機会があることを信じて、ほかの方にオススメされた記事を紹介する枠を設けます。 誰に向けて Qiita触りたての人 プログラミング始めたての人 自分自身 最初に見ておくべき記事 最初の頃は数学と同じように変数を決めていたため、aやbとしていたが、この記事を見て驚愕した（笑） リーダブルコードを読むきっかけとなった記事。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
momentで時間データの操作を楽にする - Qiita
JavaScript: document.execCommand("copy") の代替 - Qiita
JavaScriptのsomeとeveryがすごく便利 - Qiita
ライブラリにTypeScriptコードを同梱するときはディレクトリを分けよう - Qiita
JavaScriptのArrayでuniqする8つの方法（と、その中で最速の方法） - Qiita
JavaScriptでプロパティ名に変数を利用する - Qiita
JavaScript / TypeScript の豆知識 10 選 - Qiita
Reactを学ぶ上で知っておくべきJavaScriptの基本概念 - Qiita
