STORES フロントエンドの現在地 2022 - STORES Product Blog
こちらは STORES Advent Calendar 2022 8日目の記事です。 みなさんこんにちは、STORES のリテール本部でフロントエンドのエンジニアリングマネージャーをしています、 daitasuと申します。 2022年の年の瀬、 STORES のフロントエンド組織は立ち上がりから約4年の月日を迎えました。 日々のカジュアル面談や採用活動のなかで、「STORES のいまの技術状況ってどんな感じですか？Nuxt化って進み具合どうですか？」といった質問を受けることがよくあります。 STORES のフロントエンドグループについて、対外的に全体像を示すような記事が今までなかったので、本記事では、下記を紹介していこうと思います！ STORES フロントエンドの成り立ち 技術負債の解消・改善にどのように向き合っているか 2022年末現在での主な技術状況 2022年現在のスナップショットを
NestJSちょびっとだけ触ってみた所感 - タオルケット体操
ここ数年まともにサーバーサイドをやっていないなぁとかおもいつつなんやかんやあってNestJSを数日ほど触ったりドキュメントを読んだりしてたので初心を忘れないようにメモ。 いちおうTypeORMだけは出始めにちょっと使ってた。 理解度が高まったら気分が変わるかもしれないです。そしたらもっかい日記書きます。 てか全体的に難易度高くないこのフレームワーク？求められるリテラシー高くない？ お気持ち表明 前提なんですが、僕はこのフレームワークのことをまだあまり好きになれていません。オブラートを外してのべると、すでに半分くらい嫌いです。 良いとおもったところ 色々なライブラリをつけ外しして使える つまりNestJS自体が提供している機能はそれほど多くないと言う意味ですね。 そこそこ柔軟に書ける ↑で述べているように、プラガブルなんで例えばORMだってTypeORM使ってもいいしPrisma使ってもいい
Mackerel のフロントエンド "React化" プロジェクトを支える技術と設計 - Hatena Developer Blog
こんにちは, Mackerel 開発チーム アプリケーションエンジニアの id:susisu です. 現在 Mackerel では, Web コンソール画面の開発に使用しているフレームワークを, これまで使用してきた AngularJS から React へ移行することを中心とした, フロントエンド開発の刷新プロジェクトを行っています. このプロジェクトの立ち上げについては以前 Hatena Engineer Seminar で発表しましたが, そこでは時間の都合もあり, 技術的側面についてはあまり深く掘り下げることは出来ませんでした. ということでこの記事では, より技術的な面にフォーカスしてプロジェクトの内容をご紹介できればと思います. "React化" プロジェクトについて Mackerel の開発は 2014 年ごろから始まりましたが, フロントエンドのフレームワークとしては当初か
2020年にJavaScriptフレームワークをちゃんとはじめるために。｜榊原昌彦
結論を先に書くと、2015年あたりの混沌としたJavaScriptフレームワーク戦争は終わりを迎え、メジャーなフレームワークはどれも成熟してきているので、使いたいフレームワーク使ってください。 ただ技術選定においてはどれかひとつを選ばないといけないというリアルはあるので、理解を深めるための視座をいくつか紹介したいと思います。 JavaScriptフレームワークの簡易比較有名かつドキュメントが日本語化されており、入門書もでているJavaScriptフレームワークにはAngular、React、Vueがあります。 で、それぞれの違いなのですが、すごくシンプルに言ってしまうと、HTMLとJavaScriptの関係がそれぞれ違います。 ・ Angularは、HTMLとJavaScript（TypeScript）を分割してかきます。 ・ Reactは、JavaScriptの中にHTMLを書きます。
TodoMVC
Introduction Developers have a number of choices today when it comes to selecting a JavaScript framework or UI library for building scalable web apps. React / Next.js, Vue / Nuxt, Angular…the list of solutions continues to grow, but just how do you decide on which to use in a sea of so many options? To help you understand the options, we created TodoMVC - a project which has offered the same Todo
大規模Angular SPA開発に立ち向かうためにアプリとUIを切り分けた話 (1/3)：CodeZine（コードジン）
ビズリーチで「HRMOS（ハーモス）採用管理」のフロントエンドエンジニアをしています、浅井です。前編では「AngularJSのリプレースにAngularを選んだ話」についてお話しました。 今回は、長期的にサービスを発展させていくことを念頭に置き、アプリケーションの規模やチームメンバーの人数が増えていってもスムーズに開発・メンテナンスしていくために、AngularでWebアプリケーションを再構築していく中で盛り込んだことをご紹介したいと思います。 前編：「AngularJSのリプレースにAngularを選んだ話」 BizReach Tech Blog AngularJS時代の課題 せっかくAngularに移行するからには、「AngularJS時代からの負債は引き継ぎたくない、メンテナンスしやすい仕組みにしておきたい」というのがチームメンバー全員の想いとしてありました。 まずは、Angular
Vue.js + Vuex + TypeScript ファーストインプレッション - Shin x Blog
日頃は、サーバサイドの開発が主なのですが、その UI として フロントエンドの開発も行うことがあります。最近話題の Vue.js を試してみたのでその感想などを。 前提 これまで利用した構成 Vue.js 構成 雑感 ちょっと試す、がすぐにできる vue-cli が楽 vue ファイル template ディレクティブ scoped css vue-router / Vuex 連携 Vuex mutation を直接呼んで、state を変更 コンポーネントから直接 state を操作 TypeScript Vue.js 入門 さいごに 前提 これまで利用した構成 ベースとして、これまでプロダクションで利用したことがある構成は以下です。いずれも、フォームベースの SPA で、現在も稼働しています。 AngularJS 1.x AngularJS 1.x + TypeScript React
ブラウザーを自動で操作し動作確認できる、「Angular」のe2eテスト
本連載では、Webアプリケーションフレームワーク「Angular」の活用方法を、サンプルとともに紹介しています。前回はAngularのバージョン6で追加された新機能を紹介しました。今回は、Webブラウザーを自動的に操作してAngularアプリの動作を確認できる、e2eテストの利用方法を説明します。 はじめに Angularは、Googleとオープンソースコミュニティで開発されているJavaScriptフレームワークです。最初のバージョンはAngularJS（AngularJS 1）と呼ばれていましたが、バージョン2で全面的に刷新され、以降、おおむね半年に1回アップデートされています。 Angular CLIで生成したプロジェクトでは、自動的にテストを実行する機能として、「単体テスト」と「e2e（End-to-End）テスト」が利用できます。単体テストは、コンポーネントやサービスといった部品
AWS Amplify+Angular6+Cognitoでログインページを作ってみる ~フロントエンド編①~ | DevelopersIO
本ブログではAWS Amplify+Angular6+Cognitoでログインページを作っていきます。また、ついでに、API GatewayにもCognitoで認証をかけて、Cognitoでログインしているユーザのみ利用できるようにしていきます。 どうも！大阪オフィスの西村祐二です。 本ブログは下記の続きになります。 AWS Amplify+Angular6+Cognitoでログインページを作ってみる ~バックエンド編~ AWS Amplify+Angular6+Cognitoでログインページを作ってみる ~バックエンド編~ 今回：AWS Amplify+Angular6+Cognitoでログインページを作ってみる ~フロントエンド編①~ AWS Amplify+Angular6+Cognitoでログインページを作ってみる ~フロントエンド編②~ AWS Amplify+Angular6+
Angular v2からv6までの変化をまとめてみた - 余白
Angular 2から6までの主要な進化をまとめた記事を読みたい。— Masahiko Sakakibara (@rdlabo) 2018年4月20日 逆にIonicの変遷が知りたいですね 最近Stencilも出てきたしその辺の絡みとか俯瞰的に見てみたいです— lacolaco (@laco2net) 2018年4月20日 rdlaboさんがしっかりGW明けにIonicの記事書いてくれたので、僕もAngularのv2からv6まで、3年弱の変遷についてまとめます。 Ionic 2 から 4 への、この2年間の進化を振り返る 前Angular v2時代 Angular v2 オフラインコンパイル AngularJSへの .component 逆輸入 Animation API Language Service Angular CLIとスタイルガイド SystemJSからwebpackへ For
Stable AngularJS and Long Term Support
AngularJS is planning one more significant release, version 1.7, and on July 1, 2018 it will enter a 3 year Long Term Support period. UPDATE (2020–07–27): Due to COVID-19 affecting teams migrating from AngularJS, we are extending the LTS by six months (until December 31, 2021). AngularJS Panel at Angular Connect 2015BackgroundAngularJS is an extremely stable framework for building web applications
Angular 2/4が狭量で遅すぎる理由 | POSTD
(注：2017/08/30、いただいたフィードバックを元に翻訳を修正いたしました。) TL;DR — AngularJSのアイデアは、2012年には妥当と言えましたが、2017年においてはそうとは言えなくなっています。JSのエコシステムは、成熟度、柔軟性、および生産性の面で、あっという間にAngularの前を通り過ぎてしまいました。現在では、webpackやフロントエンドのNPM、成熟したツールとライブラリのエコシステムを背景として、 大型チームを有する企業であっても、 ReactやVueなどの軽量なJSライブラリを使用することで、大規模で柔軟性のあるSPAを、適切な設計で維持することが容易になっています。 加えて、Angular 2/4の問題が散見された3年の開発期間や議論の余地があるアーキテクチャの決定方針が、多くの企業にこの新しいフレームワークの採用を躊躇させているようです。 201
Angular 4が正式リリース、Angular 2から3を飛ばして4。後方互換性を維持してより小さく高速に
Angular 4が正式リリース、Angular 2から3を飛ばして4。後方互換性を維持してより小さく高速に 1つ前のバージョンはAngular 2で、新バージョンは3を飛ばして4になったのは、Angular Routerのバージョン番号とのコンフリクトを避けるためと説明されています。 Angular 4は基本的にAngular 2への後方互換性を備えており、ほとんどのアプリケーションでそのままAngular 4へバージョンアップが可能。 より小さく高速に。アニメーション機能はコアから分離 Angular 4ではフレームワーク自体がより小さく高速になったとされていますが、特にAOTコンパイラ（事前コンパイラ）の生成コードが最適化され、多くのケースで6割程度に縮小。複雑なテンプレートほど効果が大きいとのこと。 また、アニメーションパッケージがコアライブラリから分離され単独のパッケージになった
Angular入門: Component/ServiceをTestまで含めて試す - Qiita
import { Component } from '@angular/core'; import {CounterService} from './services/counter.service'; @Component({ selector: 'app-root', templateUrl: './app.component.html', styleUrls: ['./app.component.scss'] }) export class AppComponent { point: number; constructor(private counterService: CounterService) { this.point = counterService.point.getValue(); counterService.point.subscribe((v) => this.p
React.js・ReactNative・Redux入門
Feb 9, 2017Download as pptx, pdf24 likes8,612 views
Angularの次バージョンは「Angular 4」に、2017年3月リリース。今後は単に「Angular」と呼んでほしいと
Angularの次バージョンは「Angular 4」に、2017年3月リリース。今後は単に「Angular」と呼んでほしいと ベルギーのヘントで行われたAngularのイベント「NG-BE 2016」で、基調講演に登壇したGoogleのAngularチームリードIgor Minar氏は、Angularの次のメジャーバージョンアップが2017年3月に登場する「Angular 4」であることを明らかにしました。 「私たちはAngular 4を2017年3月にリリースする予定だ。本当に本当だよ（I'm being super honest with you guys!）。わけわからんなんて言わないで、大丈夫だって！（Don't freak out. It's going to be good）」（Igor Minar氏） Angular 4はAngular 2と互換性を維持し、そのまま移行できる
フロントエンジニア必見！フロントエンド界隈で注目を集めるRiot.js入門資料まとめ
JavaScriptのフレームワークはReact、Angularなどが人気ですが、ここ最近フロントエンド界隈を中心にRiot.jsが注目を集めています。 軽量でHTMLに似通った文法を採用しており、扱いやすいJSフレームワークとして人気急上昇中です。 そこで今回は、これからRiot.jsを始めるエンジニア、Riot.jsに興味のあるエンジニアに向けて、Riot.jsの入門資料（記事・スライド）をまとめました。 比較的扱いやすいJSフレームワークなので、難しく考えずにまずは使ってみてください。 JavaScript案件を提案してもらう Riot.js入門記事 Riot.js — A React-like user interface micro-library http://riotjs.com/ja/ Riot.jsの日本語公式サイトです。 ガイド、FAQ、APIなど、各メニューが日本語化
GoogleがAngular 2を正式リリース！ 未来のウェブ標準を意識した新しいフレームワーク - ICS MEDIA
GoogleがAngular 2を正式リリース！ 未来のウェブ標準を意識した新しいフレームワーク グーグルが開発するJavaScriptフレームワークAngularの最新バージョン「Angular 2アンギュラー・ツー」が本日、正式リリースされました。 Angular 2はSPAエスピーエー（シングル・ページ・アプリケーション）の開発に利用するフレームワーク。AngularJSの後継にあたります（バージョン1.x系ではJSフレームワークとしてAngularJSアンギュラー・ジェイエスという名称でしたが、バージョン2からはJSに限定しないフレームワークとなったためAngularという名称になっています）。 AngularJSはMVWフレームワークとして2010年にグーグルよりリリースされ、多くのウェブサイトで採用されてきました。新バージョンではアーキテクチャーの一新により、ウェブ標準が意識さ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
大きく進化した「Angular」バージョン9、次世代レンダリングエンジン「Ivy」を中心に機能紹介
【翻訳】 2016年にJavaScriptを学んでどう感じたか - Endo Tech Blog
