React公式ドキュメント(英語)を隅から隅までやる冒険 1-1 [JSを実行できない] - Qiita
1-1 [JSを実行できない] 記事範囲 ドキュメント 最初の1ページの1/10くらい 対象読者 Reactという単語は聞いたことがあるが全く触った事がない方 フロントエンド・バックエンドの言語をprogateレベルでちょっと触った事があり、少し手を広げたい人 公式ドキュメントを読んでみたい方 駆け出しエンジニアの雛の辿々しい歩みを眺めて和みたい方 経緯 先日 Twitter経由で認知を頂き、 OGOBの元でインターンシップの機会をいただけるかもしれないチャンスを頂いています。 弱小勉強用アカウントでこんな事が起き、 本当に種はまいておくものですね。 Reactを使い開発を行なっており、 基本的な技術を身につけるといいとのことで 公式ドキュメントを通読することにいたしました。 ただどんなプレッシャーもかけられておりませんので、 この勉強にお金はいただいておりません。 （、、 受けたい試験や
![React公式ドキュメント(英語)を隅から隅までやる冒険 1-1 [JSを実行できない] - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/e233f40c2e15243b9432bf86abf43d3252648435/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-412672c5f0600ab9a64263b751f1bc81.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9UmVhY3QlRTUlODUlQUMlRTUlQkMlOEYlRTMlODMlODklRTMlODIlQUQlRTMlODMlQTUlRTMlODMlQTElRTMlODMlQjMlRTMlODMlODglMjglRTglOEIlQjElRTglQUElOUUlMjklRTMlODIlOTIlRTklOUElODUlRTMlODElOEIlRTMlODIlODklRTklOUElODUlRTMlODElQkUlRTMlODElQTclRTMlODIlODQlRTMlODIlOEIlRTUlODYlOTIlRTklOTklQkElMjAxLTElMjAlNUJKUyVFMyU4MiU5MiVFNSVBRSU5RiVFOCVBMSU4QyVFMyU4MSVBNyVFMyU4MSU4RCVFMyU4MSVBQSVFMyU4MSU4NCU1RCZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZ0eHQtY29sb3I9JTIzMUUyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTU2JnM9MTFhYWU4OTNhYjI1ODFhNjI4NTI5YWUyMGYwZWNjZDQ%26mark-x%3D142%26mark-y%3D57%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9NzcwJnR4dD0lNDBtYXJ1bmlzaDMzJnR4dC1jb2xvcj0lMjMxRTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9MzYmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz0xNWIzMTUwYjY0YWI3YWQyYThhYWUxYjMwNThhMTAzZg%26blend-x%3D142%26blend-y%3D486%26blend-mode%3Dnormal%26s%3D00739897120af3e0de15d4be82997c12)
2023-05-26のJS: wrangler v3.0.0、playwright v1.34.0、TypeScript 5.2の予定(変換プラグイン)
JSer.info #645 - wrangler 3.0.0リリースされました Improved local development with wrangler and workerd wrangler publishがwrangler deployにリネームされています。 また、wrangler 2.0でMiniflareを同梱していましたが、 3.0ではwrangler devでMiniflareとworkerd runtimeを使ったローカル環境での開発をデフォルトに変更しています。 Release [email protected] · cloudflare/workers-sdk playwright v1.34.0リリースがリリースされました。 Release v1.34.0 · microsoft/playwright Node.js 14のサポート終了、playwrigh
夫婦の危機をChatGPTが救う！？はじめてのJavaScript 青森のラーメン屋をLINEに通知してみた - Qiita
const axios = require('axios'); // アクセストークンを入力する const access_token = process.env.ACCESS_TOKEN || 'アクセストークン'; const getShopData = async () => { const encodedPrefecture = encodeURI('青森県'); const encodedGenre = encodeURI('G013'); const url = `http://webservice.recruit.co.jp/hotpepper/gourmet/v1/?key=YOURAPIKEY&format=json&keyword=${encodedPrefecture}&genre=${encodedGenre}&count=100&offset=0&order=re
JavaScriptの"非同期処理"を理解する（Promise/async/await) - Qiita
JavaScriptで理解する非同期処理 初学者にとって、非同期処理はひとつの難関ではないでしょうか？ JavaScriptは基本的にはシングルスレッド（ひとつひとつ処理を順番に実行する）ですが、 非同期処理（複数の処理を並行して実行する仕組み）を活用することで、マルチスレッドのような振る舞いを実現しています。 この特性は、高い並行性を持つアプリケーションを開発する際に非常に有用です。 しかし、非同期処理の本質的な動作や仕組みは初学者にとって混乱の元になることが多く、JavaScriptを使用する上で非同期処理の理解が一つのハードルとなっていると思います。 結構、雰囲気で使っている人も多いと思います。 私たちがウェブサイトを使う際、裏側ではこの非同期処理が頻繁に行われていて、そのおかげでスムーズに情報を受け取ったりページが素早く動作したりしています。 この記事では、そんな非同期処理について
Reactを学ぶためNext jsを導入する - Qiita
目的：Reactを学ぶため、Next jsをセットアップする 理由：プロジェクト「study-react」をGitHubにpushするため 準備：Node.js推奨版のダウンロード（同時にnpmもダウンロードされる） gitのダウンロード typescriptのダウンロード 流れ: ターミナルを開き「yarn create next-app --typescript」と入力 プロジェクト名を聞かれるので好きな名前を入力(study-reactと入力) その後「cdコマンド」で「C/user/名前/study-react」にディクトリを移動する 「yarn dev」をする VsCodeで「study-react」を開く 「yarn build」して「yarn start」する ターミナルで 「git init」 (初期化して「study-react」内のフォルダなどがgit管理下になる） 「
ドラッグ＆ドロップで直感的に操作可能なカードをウェブアプリに一瞬で導入可能なライブラリ「gridstack.js」を使ってみた
ウェブアプリを開発するとき、できるだけ操作は直感的に行えるようにしたいものですが、ドラッグ＆ドロップという操作をブラウザ内で行えるように実装するのはなかなか面倒です。「gridstack.js」はそうした面倒な実装を代わりにやってくれるライブラリで、まさに一瞬と言えるほどの手軽さでドラッグ＆ドロップ操作可能なカードを実装できるとのことなので、実際に使って試してみました。 gridstack.js | Build interactive dashboards in minutes. https://gridstackjs.com/ gridstack/gridstack.js: Build interactive dashboards in minutes. https://github.com/gridstack/gridstack.js gridstack.jpのサイトに行くとデモが用意
【JavaScript/TypeScript】import/export from使い方まとめ - Qiita
import fromとexport from、よく分からなくなるのでまとめました。 ファイル関係図 登場人物 child1.ts, child2.ts - 【子モジュール】メインプログラムで使える変数をexportする parent.ts - 【親モジュール】小モジュール２つをまとめてexportし直す main.ts - 【メインプログラム】親モジュールをimportして使う 関係図 左が右を読み込む。 ↓(実行主体) main.ts ← parent.ts ← child1.ts ← child2.ts 子モジュール定義 // child1.ts export const hoge = 'hoge' export const fuga = 'fuga' export default 'default1' // child2.ts export const foo = 'foo' ex
ターボワープを使用してhtml&javascriptで作ったアプリをexe化する - Qiita
exe形式の実行ファイルをturbowarpを使って作ってみた。(初記事) どうもこんにちは、最近あだ名メーカー使ったら「国士無双のカリスマ店員」て出てきた人です。 今回は、最近ターボワープを使ってプロジェクトをexe化していた時に気付いたことを実験し、記事にしました。 さて、本編へ行きたいと思います。 ちなみに今回は、html&javascriptで作ったアプリケーションをexe化していきます。 方法 1,ターボワープを開きeditorを起動します。 2,最初からあるスプライトを消してから、パッケージ化を選択します 3,パッケージ化画面に来たら、アプリの名前を入力します 4,「大きな緑の旗を表示せずに自動でプロジェクトを始める」のチェックボックスにチェックを押します 5,「Electron Windowsのアプリケーション(32bitまたは64bit)」にチェックをいれて、パッケージ化を
2023-04-30のJS: Vite 4.3、Deno 1.33、Node.js 14から18へのアップデート
JSer.info #641 - Vite 4.3がリリースされました。 Vite 4.3 is out! | Vite Vite 4.3では主にパフォーマンスの改善が含まれています。 起動速度を40%から80%程度改善、HMRの処理時間を20%から40%程度改善されています。 これらをどうやって改善したのかについては、次の記事で解説されています。 How we made Vite 4.3 faaaaster 🚀 | sun0day's blog - lost in code Deno 1.33がリリースされました。 Deno 1.33: Deno 2 is coming Deno 2に向けた変更が含まれています。 unstable APIとしてDeno KVを追加、deno.jsonの形式変更が含まれています。 新しい設定形式はよりネストが少なくなるようになっています。古い設定形式はD
TypeScriptマスターへの第一歩！型安全なJavaScript開発入門 - Qiita
1. TypeScriptの魅力と基本概念 この記事では、TypeScriptの基本概念や使い方について解説します。TypeScriptはJavaScriptのスーパーセットであり、型情報を追加することでより安全なコードを実現します。JavaScriptは動的型付け言語であるため、開発者が簡単にコードを書ける反面、実行時に型に関連したエラーが発生しやすいという問題があります。TypeScriptは、静的型付けを導入することでこの問題を解決し、より堅牢で保守性の高いコードを書くことができます。 TypeScriptが登場する前のJavaScript開発では、大規模なプロジェクトでコードの管理が難しく、予期しないバグが発生するリスクが高まっていました。TypeScriptは、型システムを導入することでコードの構造を明確にし、開発者が意図しない挙動を未然に防ぐことができます。また、型情報があるこ
Reactを使ってTODOアプリを作成する JavaScriptのみ - Qiita
src |-apis ← モックサーバーと通信するファイルを格納するディレクトリ | |-todos.js ← サーバーとの通信用のファイル（CRUD） |-components ← コンポーネントを格納するディレクトリ | |-App.js ← コンポーネントをまとめるファイル | |-TodoAdd.js ← TODOを新規追加するコンポーネント | |-TodoAddCheckItem.js ← チェックリスト単体用のコンポーネント | |-TodoAddCheckList.js ← チェックリストをまとめるコンポーネント | |-TodoItem.js ← TODO単体用のコンポーネント | |-TodoList.js ← TODOをリスト化するコンポーネント | |-TodoTitle.js ← タイトル用のコンポーネント |-hooks ← カウタムフッ
[Cloudflare Pages+Next.js] AWS SDK for JavaScript v3を使ってDynamoDBからデータ取得して表示してみる | DevelopersIO
[Cloudflare Pages+Next.js] AWS SDK for JavaScript v3を使ってDynamoDBからデータ取得して表示してみる どうも！オペレーション部の西村祐二です。 最近、Cloudflare、Next.jsをさわっています。 Next.jsをCloudflare Pagesでホスティングして、DynamoDBからデータを取得するところまでいろいろハマりながら手順がわかったので、備忘録兼ねてまとめておきます。 DynamoDBからデータを取得する処理はNext.jsのAPI Routesを使ってAPIを実装し、Edgeランタイムの設定を行い、CloudflareのEdge側で動作させる方針です。 https://nextjs.org/docs/api-routes/introduction 前提条件 AWS側の初期設定やwranglerの初期設定は完了し
![[Cloudflare Pages+Next.js] AWS SDK for JavaScript v3を使ってDynamoDBからデータ取得して表示してみる | DevelopersIO](https://cdn-ak-scissors.b.st-hatena.com/image/square/1c4e9e28c189ba0da5e90990edaca836faea81b5/height=288;version=1;width=512/https%3A%2F%2Fdevio2023-media.developers.io%2Fwp-content%2Fuploads%2F2020%2F06%2Fcloudflare-1200x630-1.jpg)
AWS SDK for JavaScript v3 - クレデンシャル取得 - Qiita
目的 AWS SDK for JavaScript v3 で、 共有認証情報ファイル（~/.aws/credentials）と共有設定ファイル（~/.aws/config）から認証情報を取得する @aws-sdk/credential-providersのfromIniを使用して、 MFA 設定あり profile のクレデンシャル取得 取得したクレデンシャルを使用してサービスクライアント実行 実装 import * as readline from "readline"; import { GetCallerIdentityCommand, STSClient } from "@aws-sdk/client-sts"; import { fromIni } from "@aws-sdk/credential-providers"; import { program } from "com
React(Javascript & Typescript)でgoogleアカウント認証を行うカスタムhookを作成する - Qiita
import { useEffect, useState } from 'react'; const useGoogleAuth = () => { const [isSignedIn, setIsSignedIn] = useState(null); const [authInstance, setAuthInstance] = useState(null); const [tokenId, setTokenId] = useState(null); useEffect(() => { const initAuth = async () => { const gapi = window.gapi; await gapi.load('auth2', async () => { const auth2 = await gapi.auth2.init({ client_id: 'YOUR_CL
Cloudflare WorkersがNode.js API互換の提供を発表。Bun、Denoなどに続く対応により、Node.js APIはサーバサイドJavaScriptの事実上の標準になるか
Cloudflare WorkersがNode.js API互換の提供を発表。Bun、Denoなどに続く対応により、Node.js APIはサーバサイドJavaScriptの事実上の標準になるか Cloudflareは、エッジでJavaScriptを実行できるサービス「Cloudflare Workers」において、Node.jsのAPI互換機能を提供すると発表しました。 node.js APIs have officially landed in Cloudflare Workers — no polyfills required. We've added AsyncLocalstorage, EventEmitter, Buffer, assert and util, with more on the way soon.https://t.co/8CkPZkS3Yb — Cloudfl
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
オブジェクトのクローンにJSON化を使う時代は終わった！【JavaScript】 - Qiita
お前らはjsのvarとletの違いを分かってない - Qiita
AWS SDK for JavaScript v2 から v3 にする - Qiita
JavaScript・Python・Swiftでは配列の挙動が違いハマった話 - Qiita
JSを使ってクリップボードへコピーする機能を実装した - Qiita
