本記事は、TechFeed Experts Night#27 〜 フロントエンドフレームワーク最前線のセッション書き起こし記事になります。 イベントページのタイムテーブルから、その他のセッションに関する記事もお読み頂けますので、一度アクセスしてみてください。 本セッションの登壇者 セッション動画 では、これからAngular最新動向ということで発表させていただきます。よろしくお願いします。 まず軽く自己紹介ですが、lacolacoと申します。このような活動をしています。
こんにちは、テックフィード白石です。 日本のエンジニア界隈をリードするエキスパートに、テクノロジーの最前線を語っていただくYouTube動画連載「Ask the Expert」の新着動画が公開されました! 今回は、TypeScriptのエキスパートうひょさんに、TypeScriptの最新動向について詳しく伺ってきました。 うひょさんのアカウントをぜひフォローしましょう! うひょさん(株式会社カオナビ フロントエンドエンジニア) ついでに白石のもフォロー推奨: 聞き手: テックフィード白石 以下に掲載するのは、インタビュー動画の内容の要約です(正確な書き起こしではありません)。 内容をフルにご覧になりたい方は、ぜひ動画をご視聴ください。 (ご質問、ご感想などはYouTubeのコメント、もしくはこの記事のコメント欄でも受け付けております) TypeScript史上初めてのdeprecation
4月6日、JavaScriptのコード品質管理ツールであるESLintは、その最新版バージョン9.0.0をリリースした。このアップデートでは、新機能の導入、バグ修正、そしていくつかの重大な変更が行われた。 4月6日、JavaScriptのコード品質管理ツールであるESLintは、その最新版バージョン9.0.0をリリースした。このアップデートでは、新機能の導入、バグ修正、そしていくつかの重大な変更が行われた。 新しいバージョンをインストールするには、以下のコマンドを実行するだけでよい。 npm i eslint@9.0.0 --save-dev 主な変更点を以下に挙げる。 Node.jsサポートの更新 主要な変更点の一つとして、Node.jsのサポートが更新された。これにより、Node.js v18.18.0未満およびv19のサポートが終了し、Node.js v20.xが現在のLTSリリース
型システムの背景理論プログラミング言語の型システムにはそれぞれ固有の世界観があり、言語ごとに型の機能が異なります。 その一方で複数の言語で共通している機能もあり、それらのさまざまな型の機能は唐突にどこからともなく出現してきたわけではありません。背景として大きくは型理論(type theory)と呼ばれる数学的な研究分野があり、各言語の型システムは型理論に基づいて実装されています。 たとえば、TypeScriptのunknown型やnever型のような一見何のためにあるか分からないような型であっても、型理論においてはその役割や機能を一般的に説明することができます。これらの型はトップ型やボトム型と呼ばれる型の種類に分類され、部分型関係が作る階層構造の両端点に位置する型として振る舞います。 部分型階層の両端点に位置する型型理論的な観点からの知識を持つことで似たような型システムを持つ他の言語にお
はじめに 今回はフロントエンド(主にReact, Next, TypeScript)でおすすめの学習教材をまとめました。 対象者 エンジニア初心者 モダンフロント技術を学びたい人 ロードマップ Developer Roadmaps エンジニア向けの学習ロードマップが整理されています。 現在の自分の立ち位置を把握し、次にやるべきことの方向性を知ることができます。 エンジニアが使うであろう、ほぼ全技術が網羅的にまとめられているので、まずはこのロードマップを使って現在の立ち位置を掴んでみてください。 TypeScript typescriptlang 公式が提供している学習サービス。 基本文法から実践的な内容まで学ぶことができる。英語が苦手でなければここで一通り学ぶべき。 サバイバルTypeScript 実務で使えるTypeScriptの実装方法を学ぶことができる。応用的な内容も多いが、解説が丁
この記事で分かること TypeScript(JavaScript)における関数の宣言方法 各宣言方法におけるthisの扱い 初めに 初めまして。新人エンジニアをしているものです。 先日TypeScriptにおける関数宣言について学習する一環で、thisの取り扱いについて学んだので備忘録として書き上げます。 (前提)TypeScriptの関数の宣言方法 まずは複数ある関数の宣言方法を簡単にまとめます。 ①function構文による宣言
はじめに 既存のプロダクトで、TypeScript のバージョンをアップデートし satisfies を使った実装を試してみました。 その中で、satisfies を使って特に嬉しかったところを書かせていただきます。 satisfies とは TypeScript 4.9 で追加された演算子 式と型がマッチしているかチェックする const assertion と併用できる annotation との違いとして推論結果を保持できる 詳しくは公式のドキュメントや、こちらの記事にわかりやすく紹介されています。 嬉しかったところ 個人的に既存のプロダクトにおいて以下のパターンで satisfies を使った実装にするととても嬉しかったです。 ある関心ごとのステータスを定義したオブジェクトと、そのバリューのユニオン型が定義されている実装がありました。(ここではポケモンの状態異常を例にさせていただい
こんにちは、ブランドソリューション開発本部フロントエンド部の田中です。 普段はFAANSのWebフロントエンドの開発を行なっています。 FAANSとは「Fashion Advisors are Neighbors」がサービス名の由来で、ショップスタッフの効率的な販売をサポートするショップスタッフ専用ツールです。 ショップスタッフ向けにコーデ投稿・成果確認などの機能が存在し、2022年8月に正式ローンチしました。詳しくは以下のプレスリリースをご覧ください。 corp.zozo.com 現在FAANSは立ち上げから2年経過し、Webフロントエンドの開発現場において様々な組織的・技術的課題がありました。 今回はその課題と取り組みについて紹介したいと思います。 目次 目次 前提 FAANSの組織の特徴 FAANSのWebのプロダクトの特徴 変化の多い環境下で遭遇し続ける課題 組織的・技術的課題とそ
ライブラリがこんな構成になっていませんか? TypeScript製のライブラリをnpmで配布するとき、そのパッケージの構成は次のようなフラットな構造になっていませんか?フラットな構造とは、TypeScriptファイル(.ts)と、型定義ファイル(.d.ts)が同じディレクトリにあるような構成です。 ├── index.ts ...... TypeScriptファイル ├── index.d.ts .... 上の型定義ファイル | package.jsonのtypesフィールドで指定してる。 ├── index.js ...... 上のJavaScriptファイル | package.jsonのmainフィールドで指定している。 | ├── module.ts ..... TypeScriptファイル | index.tsからimportされている。 ├── module.d.ts ...
フロントエンド領域でチームをリードしたいエンジニア募集中! 株式会社カオナビ @kaonavi React TypeScript Web Standards / Browsers CSS JavaScript I want to hear a detailed 株式会社カオナビでは、場所と時間に縛られない、新たな働き方制度「MY WORK STYLE」を始めています。 働く場所の選択(出社 or 自宅 or 許可された就業スペース) スーパーフレックス制度 スイッチワーク制度 などなど、詳しくはこちらをご確認ください! 「場所と時間に縛られない、新たな働き方制度 MY WORK STYLE を開始」 https://corp.kaonavi.jp/news/pr_20201201/ 【募集概要】 自社サービスのタレントマネジメントシステム「カオナビ」において、新機能開発や機能拡張の実装、パ
経緯 world.hey.com DHHが「オタクくん見てる〜? 今からうちのレポジトリからTypeScriptを剥しま〜す」と宣言したことにより、Web開発者界隈でTypeScriptの是非自体の話になり騒ぎになった*1*2。 github.com その後、野次馬がたくさん集ってきてrevertプルリクエストを立てる人やTypeScript公式リポジトリから全ソースコードを消すプルリクエストを出す*3ようなキッズムーブをする人も出てきた world.hey.com 実際の変更 8617行のTypeScriptがJavaScript化された。(Sloc 便利) ❯ scc src/ ─────────────────────────────────────────────────────────────────────────────── Language Files Lines Blan
8月10日、TypeScriptは5.2のリリース候補版を発表しました。 このバージョンでは、新機能や変更点がいくつか追加されており、TypeScriptユーザーにとって注目すべき内容となっています。 詳細は以下の通りです。 TypeScript 5.2 リリース候補の発表 8月10日、TypeScriptチームはTypeScript 5.2のリリース候補(RC)を発表した。 TypeScript 5.2の新機能の一覧は以下の通り。 using宣言と明示的リソース管理の使用 デコレータメタデータ 名前付きと匿名のタプル要素 ユニオン配列のより簡単なメソッド使用 TypeScript実装ファイル拡張子を使用した型のみのインポートパス オブジェクトメンバーのコンマ補完 インライン変数のリファクタリング 継続的な型互換性の最適化チェック 互換性のない変更と正確性の修正 using宣言と明示的リソ
3位 M5Stack Core2(特別色)M5Stack Japan Creativity Contest 2021 オンラインヒーロー by 一般社団法人MAヒーローズ・リーグ 2021 ユカイ工学賞 byユカイ工学株式会社ヒーローズ・リーグ 2021 開発素材 M5Stack Moddable Google Cloud Text-to-Speech M5Stack UnitV2 MediaPipe Holistic MediaPipe Face Mesh スタックチャン VOICEVOX ChatGPT API システム構成 関連イベント ヒーローズ・リーグ 20212021-09-06 開催 M5Stack Japan Creativity Contest 20212021-07-15 開催 「Maker Faire Tokyo 2022」の出展作品まとめ(一部だよ|非公式だよ)20
もちろん裏取りは必要ですが、エディターの設定ファイルをどう書くのかAIに聞いてみるのも面白かったです。特にエディターは「○○みたいにしたい」というのを言語化して、どう調べれば良いのかわからなかったので今後も助けてくれそうな気がしています。 こんにちは。AWS事業本部コンサルティング部に所属している今泉(@bun76235104)です。 今回は超がつくほどのの小ネタなのですが、生成系のAIにVSCodeの設定周りについて聞いたり、作業をお願いしたらとても快適だったので使い方の一旦を紹介します。 やってみたことは以下のとおりです。 独自スニペット用のJSON文字列を書いてもらう キーボードショートカットの設定(keybindings.json)の書き方を教えてもらう 設定ファイル(settings.json)の書き方を教えてもらう 実際にやってみた 今回試している環境は以下のとおりです。 試し
TypeScriptをコンパイルしてWebAssemblyバイナリに、実現を目指す「TypeScript Compilation SIG」をByteCode Allianceが発表 WebAssemblyの普及と発展を目的とするByteCode Allianceは、TypeScriptのコードをコンパイルしてWebAssemblyバイナリを生成できるようにすることを目指すスペシャルインタレストグループ「TypeScript Compilation SIG」を発表しました。 WebAssemblyの仕様策定はW3Cが行っており、ByteCode AllianceはそのWebAssemblyを基盤として、クロスプラットフォーム対応を実現するAPI群のWASI(WebAssembly System Interface)やコンポーネントモデル、ガベージコレクション対応などの拡張、およびそれらの事実
こんにちは。ひらやま(@rhirayamaaan)です。 先日とあるツイートを見かけ、つい反応してしまいました。 これはReactコンポーネントを作る時に最低限必要なTypeScriptの知識をまとめた記事を書く気運高まってますか…!!? https://t.co/rb9iwfNqDG— ひらやま (@rhirayamaaan) 2023年3月1日 3, 4年くらい前(2023年4月現在)は、フロントエンドを好むエンジニアやプログラムを書くマークアップエンジニアが目を輝かせながら React に飛びついていたように私は感じていました。しかし最近では React を使ったサービスが運用される機会も増え、デザイン修正を行うためにデザイナーが React のコードを触るケースも徐々に増えてきている印象があります。 ここ最近ではデザインエンジニアや UX エンジニアという形で表記ゆれを許しながら新
基本こちらのものを TS で書き直した感じです。 ▼ langchain.js のドキュメント ▼ サンプルコードがあるレポジトリ Vectorstore の準備 まず事前準備として Vectorstore なる AI のためのデータベースを用意します。 いくつかオプションがあるのですが、私は違いがよく分かっていないのでこちらの pinecone というものを使ってみました。 正直私は具体的に Vector とはなんなのか分かっておらず雰囲気で使っています。pinecone が解説記事を書いているのでこちらを読んでみると良いかもしれません。 こちらに SignUp した後、Indexes を選択し、 Create Your First Index! をクリックします。 Index Name に適当な名前をつけ、Dimensions には 1536 と入力します。なんか1536次元のベクトル
はじめに 本記事ではNode.js環境でTypeScriptを用いてPDFテキストを抽出する手順について、プロジェクトのセットアップから扱います。また、型定義を参照しつつサンプルコードに解説を加え、筆者の環境で遭遇したエラーも簡単に取り上げています。 想定読者 PDFをTypeScriptで扱いたい人。 使うもの/環境 2023年3月上旬、下記の環境化での実装です。 OS: Windows 11 VSCode コードの実行はCode Runnerを使用。 Node.js v16.13.2 16系だとエラーが生じます。本文ではそのエラーも扱います。 TypeScript v4.5.5 インストール済であること、文法の知識は前提としています。 pdfjs-dist PDF.jsのnpmライブラリ PDFの操作に使用 サンプルPDF 日本語、テキストのみ。 Marked Contentは対象外。
最低限の知識で簡単なWebアプリを作る(生JavaScript vs React&TypeScript、やりたいこと別サンプル集)JavaScriptTypeScriptWebアプリケーションフロントエンドReact はじめに ユーザーが何の準備も必要なく、PCでもスマホでも動かすことができるWebアプリの魅力に惹かれてJavaScriptを勉強しました。 Web初心者のわたしが最終的にはこんなアプリたちを作ることができました。 完全に独学なので「もっといい方法がある」とか「もっときれいに書ける」とかはあるかもしれませんが、これらを実装した経験を通して、必要だった最低限な知識をまとめようと思います。 サーバーとのやりとりは一切しない(したい方はすればよい)ので、定義によっては「Webアプリ」とは言わないかもしれませんが、ここでは便宜上そう呼ぶことにします。(あとがきも参照) 対象読者 We
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く