サクサク読めて、
アプリ限定の機能も多数！
アプリで開く
AWS サーバーレスサービスによるマルチテナント SaaS ソリューションの構築 | Amazon Web ServicesAmazon Web Services ブログAWS サーバーレスサービスによるマルチテナント SaaS ソリューションの構築 この記事は、Building a Multi-Tenant SaaS Solution UsingAWS Serverless Services を翻訳したものです。本投稿は、AWS SaaS Factory の Sr. Partner Solutions Architect である Anubhav Sharma とAWS SaaS Factory の Partner Solutions Architect である Ujwal Bukka により寄稿されました。 SaaS (Software-as-a-Service) 提供モデルへの移行に際しては、コストと運用効率を最大限に高めたいという要望が伴います。 これは、利用傾向を予測することが困難なマルチテナン
なんとなく自分の中で言語化しておきたかったので、整理も兼ねて記載しておきます🙆🏻♂️ 普段仕事で様々なAngular、またはReactのコンポーネントを作ったりメンバーから出るPRを読む中で、コンポーネントのスタイルはどういうふうに当てるのが破綻しにくいんだろうと考えていました🤔Angularは良くも悪くも一つのComponentが結構おっきくなりがちだったのでそこまで意識しなかったですが、Reactは何なら分割しないと気持ち悪いとすら思えるくらいにコンポーネントを分割しやすいです。 コンポーネントを分割することは各ファイルごとに把握すべき事柄が減るので基本的にはいいことだと思っていますが、スタイリングについては意識しないと破綻してしまうなーと思っています。 （もちろん、スタイリングに限らず意識しないと破滅するんだけど、今回はスタイルについての話です） スタイルの破綻っていうのは
AngularユーザーがFlutterを覚える際、Angularでいうところの〇〇。みたいな思考でスピードラーニングできる箇所があるので詰まりどころと合わせて勘所を随時更新していきます。TSとDartの連想がメインになりそうです。 随時更新していきます。間違った理解があればご指摘いただければと思います。 Interfaceはない 形はすべてClassとして定義。 anyはdynamic any同様基本使うべきでないという認識 JSON（オブジェクト）をそのまま扱うことはできない TSの場合Firestoreからの値はオブジェクトとして使えるが、Dartの場合一度Classにマッピング（デシリアライズ？）する必要がある。 デシリアライズは自動化パッケージがたくさんあるが、Fireshipでは手動が信頼性高いとのこと。僕もパッケージを使いましたがうまくいかないシーンがあったので手動を採用してい
この記事の目的は、既にAngular、もしくはAngularDartでの状態管理手法を理解しており、これからFlutterの状態管理手法を学びたいと言う方に向けて、Angularの知識を梃子にして少ない労力でFlutterの状態管理手法を理解していただくことです。私自身の、AngularまたはAngularDartでの経験に基づいています。FlutterにはWebサポートがあり、WebブラウザーでFlutterを動かすことができます。Flutter on the Webと呼称されています。ただし、現在はβ版であり、プロダクションに導入するにはいくつかの高い壁があるため、要件をよく吟味する必要があります。Flutter on the Webの進捗状況についてはこれから別記事でまとめていく予定です。さしあたっては以下の記事を紹介しておきます。
AngularとRailsを組み合わせてみる 前回の記事ではAngular+NestJSの組み合わせについてピックアップをしましたが、今回はRuby onRails5とAngular8の組み合わせでwebアプリを作成している記事があり、読んでいてとても面白い内容だったので翻訳に挑戦しました！ どちらも個人的に気に入っているフレームワークなので、世の中にこの組み合わせでの開発が増えてくると嬉しいです。Angular8とRails5 (＊以下記事の翻訳) あたなはどうか知らないが、学びやすく、素早く書けて、オープンソースという理由で私はRuby onRailsが大好きだ。また、Ivyというクールな新しいレンダーエンジンを導入したAngularの新バージョン、Angular8のリリースにもワクワクしている。 もしあなたが私と同じでこれら２つのフレームワークに関する興味をわかってくれて、でも
この記事ではAngularDart/Flutterの文脈で新しいコンポーネント設計パターンとして広まりつつあるBLoCパターンを、Angularの語彙で理解し、実装する方法を紹介する。BLoCパターンとはBLoCとは、BusinessLogic Componentの略である。BLoCを使ったアプリケーションの実装パターンをBLoCパターンと呼ぶ。 まず誤解を招きそうなポイントとして、この"Component"はReactやAngularなどでいうところのビューを構築する"コンポーネント"ではない。 一般的な単語としての、アプリケーションを構成するひとかたまりの要素という意味の"Component"なので誤解しないこと。 対比するレベルとしては、"UI Component" vs "BusinessLogic Component"のようになる。BLoCは複数の環境向けにアプリケー
ウェブのフロントエンド開発に役立つライブラリとして、VueとReact、Angularがよく取り上げられます。これらのライブラリは、SPA（シングルページアプリケーション）の開発に役立つ多くの機能を持っています。 フレームワークを選定するには、「人気だから使う」という短絡的な理由で選択をするのは望ましくありません。設計思想や機能の種類、学習コストなどの観点で、プロダクト・プロジェクトチームへの適性を検討するのがセオリーです。幸いにも、それぞれを比較した記事がウェブに数多くあり、選定のヒントを簡単に得ることができます。 一方、機能面の比較ばかりが取り上げられ、性能面で紹介されている記事が少ないように見受けられます。記事『サービスにおいて速さこそが神である｜深津 貴之』でも紹介されているように、昨今のウェブはスピードが求められる時代でもあり、ライブラリの性能評価の記事があってもよいのではないで
こんにちは。 最近フロント側のフレームワークをAngularに乗り換えたので自分のメモとしてAngular入門をまとめました。Angularとは？ 「Angular is a platform that makesit easy tobuild applications with the web.Angular combines declarativetemplates, dependency injection, end to end tooling, and integrated best practices to solve development challenges.Angularempowers developers tobuild applications that live on the web, mobile, or the desktop. 」 とのこと
![[Angular] 入門 - Qiita](/image.pl?url=https%3a%2f%2fcdn-ak-scissors.b.st-hatena.com%2fimage%2fsquare%2f79c5f053c14fdc93d8c9943e35d06a2b04d029f2%2fheight%3d288%3bversion%3d1%3bwidth%3d512%2fhttps%253A%252F%252Fqiita-user-contents.imgix.net%252Fhttps%25253A%25252F%25252Fqiita-user-contents.imgix.net%25252Fhttps%2525253A%2525252F%2525252Fcdn.qiita.com%2525252Fassets%2525252Fpublic%2525252Farticle-ogp-background-afbab5eb44e0b055cce1258705637a91.png%25253Fixlib%25253Drb-4.0.0%252526w%25253D1200%252526blend64%25253DaHR0cHM6Ly9xaWl0YS11c2VyLXByb2ZpbGUtaW1hZ2VzLmltZ2l4Lm5ldC9odHRwcyUzQSUyRiUyRnMzLWFwLW5vcnRoZWFzdC0xLmFtYXpvbmF3cy5jb20lMkZxaWl0YS1pbWFnZS1zdG9yZSUyRjAlMkYyNDE5MDklMkY1ZGU1MmRjNTAzODc4N2IzNWZjOTJkODhiNDY4ZmM3YTI2OTM2NjI1JTJGeF9sYXJnZS5wbmclM0YxNjY0NzYzNzQ4P2l4bGliPXJiLTQuMC4wJmFyPTElM0ExJmZpdD1jcm9wJm1hc2s9ZWxsaXBzZSZiZz1GRkZGRkYmZm09cG5nMzImcz0wMWQ5N2I2MTkzM2RhYmMxODNkOGRlYmI3ZmFiOTBkYQ%252526blend-x%25253D120%252526blend-y%25253D467%252526blend-w%25253D82%252526blend-h%25253D82%252526blend-mode%25253Dnormal%252526s%25253De63cbc0e90588ee773256464ed72cf53%253Fixlib%253Drb-4.0.0%2526w%253D1200%2526fm%253Djpg%2526mark64%253DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk2MCZoPTMyNCZ0eHQ9JTVCQW5ndWxhciU1RCUyMCVFNSU4NSVBNSVFOSU5NiU4MCZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZ0eHQtY29sb3I9JTIzMUUyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTU2JnR4dC1wYWQ9MCZzPTM5MzQ1YTUyZGNlOTU0MDk1ZjJkZTM1OWFmZGMyOGQ4%2526mark-x%253D120%2526mark-y%253D112%2526blend64%253DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTgzOCZoPTU4JnR4dD0lNDBzeWFudGllbiZ0eHQtY29sb3I9JTIzMUUyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTM2JnR4dC1wYWQ9MCZzPTMxZDY5NThkZmJiYTlkYzBlZGMxNjBjN2I2ZTY5Mzg0%2526blend-x%253D242%2526blend-y%253D480%2526blend-w%253D838%2526blend-h%253D46%2526blend-fit%253Dcrop%2526blend-crop%253Dleft%25252Cbottom%2526blend-mode%253Dnormal%2526s%253D225e1eb5eda44348cb6e0bd6dbacf173&f=jpg&w=240)
ERRORError: ExpressionChangedAfterItHasBeenCheckedError: Expression has changed afterit was checked. Previous value: 'something: null'. Current value: 'something: something'. Componentを入れ子構造にしているとよく見るこのエラー どうも、子供のComponentから親Componentを変更しようとすると発生するようだ。Angularでは、子供のComponentからの親の変更を基本的に禁止しているので、こういうことが出るらしい。 とりあえずこの2つのどっちかでOK setTimeout による非同期処理化 detectChanged による明示的な変更 今回の例の前提と登場人物 子Componentによ
![[Angular] ExpressionChangedAfterItHasBeenCheckedError への2つの対処法 - Qiita](/image.pl?url=https%3a%2f%2fcdn-ak-scissors.b.st-hatena.com%2fimage%2fsquare%2f37f31054083789ffd2cc7539962d79b84d8768f1%2fheight%3d288%3bversion%3d1%3bwidth%3d512%2fhttps%253A%252F%252Fqiita-user-contents.imgix.net%252Fhttps%25253A%25252F%25252Fcdn.qiita.com%25252Fassets%25252Fpublic%25252Farticle-ogp-background-412672c5f0600ab9a64263b751f1bc81.png%253Fixlib%253Drb-4.0.0%2526w%253D1200%2526mark64%253DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9JTVCQW5ndWxhciU1RCUyMEV4cHJlc3Npb25DaGFuZ2VkQWZ0ZXJJdEhhc0JlZW5DaGVja2VkRXJyb3IlMjAlRTMlODElQjglRTMlODElQUUyJUUzJTgxJUE0JUUzJTgxJUFFJUU1JUFGJUJFJUU1JTg3JUE2JUU2JUIzJTk1JnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9NTYmcz0wOWI4NGViZGU0ZjU5MTdkYmMwNTk2OTAzZjllMDhhYg%2526mark-x%253D142%2526mark-y%253D57%2526blend64%253DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9NzcwJnR4dD0lNDBzZXRlZW4mdHh0LWNvbG9yPSUyMzIxMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT0zNiZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZzPTNmN2YxNzYyZmUzZDY4YjE4MGMyYzY0N2FkMDg3YTYz%2526blend-x%253D142%2526blend-y%253D436%2526blend-mode%253Dnormal%2526txt64%253DaW4g5pWZ6IKy57O744Ko44Oz44K444OL44KiIOOChOOBo-OBmeOCk-OBqOOBneOBruWRqOi-ug%2526txt-width%253D770%2526txt-clip%253Dend%25252Cellipsis%2526txt-color%253D%252523212121%2526txt-font%253DHiragino%252520Sans%252520W6%2526txt-size%253D36%2526txt-x%253D156%2526txt-y%253D536%2526s%253Da1dfc019bd3c8bb6e378381e6461fcca&f=jpg&w=240)
Angularが提供しているコアAPIにViewChild、ViewChildrenデコレーターがありますが、これととても似た名前/機能を持つContentChild、ContentChildrenというデコレーターも存在しています。これらの違いに関してなるべく詳細にまとめました。 なお、ViewChild、ViewChildrenに関する解説はこちらの記事にて解説しています。 目次 ContentChildとは ContentChildはViewChildと同様、デコレーターの引数に渡したセレクターと一致するDOMの最初の要素またはディレクティブを取得するためのAPIです。セレクターと一致したDOMが見つかった場合、デコレーターを設定したプロパティが更新されます。 ライフサイクルフックのngAfterContentInitコールバック以降で取得されたDOMにアクセスすることが出来ます。
概要 クライアントからのAPIコールは可能であれば避けた方がサーバの負荷も下がり、ユーザの体感速度も上がります。 １度取得すればほぼ変わらないデータなどは、最初にAPIコールした後はできれば避けたいです。 一方でcookieやlocalstorageで管理するほどでもない、というときはBehaviorSubjectを利用します。 環境Angular 4.3.4 rxjs 5.4.2 BehaviorSubjectとは 基本的な動作 BehaviorSubjectの大きな特徴は直前にonNextで渡された値を保持し、subscribe()やgetValue()するとその保持していた値を取得できるところです。 ref:ReactiveX - Subject サンプル const sub = new Rx.BehaviorSubject(1); sub.subscribe(v => { co
Whenbuilding large scale applications that deploy to a variety of environments with different audiences, we often need the ability to show/hide certain features in theUI. TheAngular CLI provides us an environment.ts file that can help us quite a bit with this but limited to static values. What if we want to change these at dynamically atbuild time, lets say we have Chefbuilding our app to a v
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
