Marginalia
すべて Tech Idea Diary 2024-07-03 読んだ本 2024-Q2 Diary読書 2024-07-03 Angular: v18.1で @let 構文が追加される TechAngularTypeScript 2024-06-26 WebブラウザにおけるOpenTelemetryの自動計装PoC: Trace via Service Worker TechWebOpenTelemetryService Worker 2024-06-23 Cloudflare Image Transformationで画像最適化した TechCloudflareBlog DevAstro 2024-06-20 Angular: Rendering EffectsとBusiness Effects TechAngularSignals 2024-06-14 計画の優先順位ではなく目標の優先
Learn Angular step by step for Beginners - Lab 1
This article was written in the initial days of Angular 2. With lot of changes Angular went through i have rewritten the complete article using Angular 4 , please do refer this article to avoid further confusion Learn Angular 4 step by step Download 100 page Learn Angular Ebook ( covering 10 labs) - 3.2 MB Download Lab1CustomerAngularProject.zip - 94.1 KB Contents Introduction What is the Goa
Angular Handson Geek Women Japan
angular-handson.md Step.1: 簡易サーバ Node.js 若しくは Python、 Ruby で簡易サーバが利用出来るように準備します node: $ npm install live-server -g $ live-server node: $ npm install http-server -g $ http-server Ruby $ ruby -run -e httpd -- -p 8000 or $ ruby -rwebrick -e 'WEBrick::HTTPServer.new(:DocumentRoot => "./", :Port => 8000).start' Python 2系 $ python -m SimpleHTTPServer VSCode スニペット Install Visual Studio Code 0.10.1 or hig
Angular2でlocalStorageを扱うServiceを実装する - Qiita
背景 SPAではないAngularアプリで、ある機能を実装していて、画面をまたぐ保存領域が欲しくなった Cookieで実装しようとしたが、容量が足りない localStorageを使うことにした localStorageとは Window.localStorage - Web APIs | MDN The localStorage property allows you to access a local Storage object. localStorage is similar to sessionStorage. The only difference is that, while data stored in localStorage has no expiration time, data stored in sessionStorage gets cleared when t
Angular2でFlexのViewStackを作ってみる - Goalist Developers Blog
全国のFlexファンの皆様、お久しぶりです！ ゴーリスト開発の盛次(モリツグ)です。 前回のAngular2とFlexを比較してみたの影響で全国に90人はいると思われるFlex愛好者たちがAngular2に目覚めてくれたことだと思います。 今日は以下のような方に向けた内容になります。 ・Angular2で動的にコンポーネントを追加したい方 ・Angular2でもaddChildしてselectedIndexしたくて我慢できない方 ViewStackのデモを触ってみる Flex経験者でない方にViewStackの説明が必要ですね！ ViewStackとはコンポーネントを格納するためのコンテナです、複数コンポーネントを格納できますが、表示するのは現在選択中のものだけです。 Angular2では標準で画面遷移の仕組みが用意されており、遷移時にServiceを差し込めたりと非常に便利です。 しかし
Angular入門: http通信部分やテストを試す - Qiita
概要 前回（Angular入門: Component/ServiceをTestまで含めて試す）の続きです。 今回は 通信処理の書き方 テストの書き方 動作確認・デプロイ を書いていきます。 作った画面 要件としては、前回分に加えて AsyncIncrementボタンを押すと、サーバーにデータを取りに行って非同期に数字が加算される。 という形です。 環境 angular-cli: beta-32 Angular: 2.4 NodeJS: 6.9 ソースコードはこちら↓ https://github.com/uryyyyyyy/angularSample/tree/async 前提：APIサーバー SPAの場合は、フロントのリソースはS3などのホスティングサービスから配信するかもしれません。 その場合はAPIサーバーのエンドポイントは別のホストになることが有り得ます。 本記事ではそのような配信
Angular入門: Component/ServiceをTestまで含めて試す - Qiita
<p>Counter</p> <p>Point: {{point}}</p> <button (click)="increment(3)">Increment 3</button> <button (click)="decrement(2)">Decrement 2</button> 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; c
Angular 2を使うならUIはコレで！Ionic 2ことはじめ（正式リリース版対応） | HTML5Experts.jp
Angular 2を使うならUIはコレで！Ionic 2ことはじめ（正式リリース版対応） 榊原昌彦（一般社団法人リレーションデザイン研究所 ...） Web制作してると、また新技術が出たのかと思うと、気づいたら「新常識」が増えてたということに頻繁に出会います。 タスクランナー、SCSS、LiveReload、SPA、PWA、ハイブリッドアプリ。そういった近年のキーワードを一気に体験できるUIフレームワーク「Ionic 2」が先日リリースされましたので、ご紹介します。 編集部注: Angular 2の正式名称は「Angular」ですが、現状だと「AngularJS 1.x」のことを呼称していると誤解される可能性が高いと判断し、本稿では「Angular 2」で統一させていただきます 記事の内容が古くなってたので、2017年8月11日に更新しました Ionic 2の概要 Ionic2は、アメリカ
Angular2でComponentをまたがったデータのやり取り - Carpe Diem
概要 Angular2でComponent間でデータをやり取りしたい状況が出てくると思います。 例えば「このボタンを押したら外部APIを叩いて状態を更新したい。その状態を他のComponentでも使っているので更新を反映したい」ときなどです。 今回はServiceにデータを保持して、それを各コンポーネントで利用するやり方を紹介します。 環境 angular-cli 1.0.0-beta.25.5 Angular 2.4.3 完成形 今回の成果物はこちら github.com フォルダツリーは以下です。 ├── app.component.css ├── app.component.html ├── app.component.spec.ts ├── app.component.ts ├── app.module.ts ├── child │ ├── child.component.cs
Angular2 DOC GUIDEを翻訳する[DOCUMENTATION OVERVIEW] - Qiita
Learning path - 学習方法 - ほとんどのページは独立しているので、ガイドをそのまま読み進める必要はありません。 新しくAngularを始める方には、次のようにガイドセクションを進めていく学習方法をお勧めします。 全体像を知るために、Architecture overview(英文)を読みます。 QuickStart(英文)を試してみてください。QuickStartはAngularの"Hello, World"です。その過程を通して、Angularアプリを書くために必要なライブラリやツールのセットアップ方法がわかります。 QuickStartではカバーしきれなかった点をフォローしてくれるTour of Heroes tutorial(英文)に従い、簡易的なテータ駆動型アプリを作成してください。そのアプリでは、本格的なアプリケーションとして重要となる次の特徴を試すことができます
![Angular2 DOC GUIDEを翻訳する[DOCUMENTATION OVERVIEW] - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/831085e0e90dcdb999c012714bb89cfaabc42cd3/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-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9QW5ndWxhcjIlMjBET0MlMjBHVUlERSVFMyU4MiU5MiVFNyVCRiVCQiVFOCVBOCVCMyVFMyU4MSU5OSVFMyU4MiU4QiU1QkRPQ1VNRU5UQVRJT04lMjBPVkVSVklFVyU1RCZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTU2JnM9ZGE5YzZlNzNkM2Y5N2MyNTgyMWNhZDUyMDE2MzY2MDk%26mark-x%3D142%26mark-y%3D57%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9NzcwJnR4dD0lNDBZYW1hbW90bzA1MjUmdHh0LWNvbG9yPSUyMzIxMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT0zNiZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZzPWVhYTEwZjNlZGRjYzM5MmE3OGJkMjcxYmJkMmNiZmI3%26blend-x%3D142%26blend-y%3D486%26blend-mode%3Dnormal%26s%3D6847eb7a5540300eec3162634dea1964)
Angularチュートリアル + Spring Bootやってみた - Qiita
package com.example.controller; import com.example.model.Hero; import org.springframework.http.MediaType; import org.springframework.web.bind.annotation.*; import java.util.*; import java.util.function.Function; import java.util.stream.Collectors; @RestController public class HeroController { /** * hero list */ private List<Hero> heroes; /** * angular tutorial * reference app/in-memory-data.servic
hacked by x-Qey
x-Qey : The Turks were here ANONIM(); TNX : X-Qey - matherS
Angular-CLIチートシート - Qiita
@armorik83です。今回はangular-cliについてまとめます。 angular-cli https://cli.angular.io/ Prototype of a CLI for Angular 2 applications based on the ember-cli project. angular-cliはAngularの2.x以上（本稿ではAngularと記述する）を用いたアプリケーションの開発を補助するCLIツールである。 インストール インストールは至って簡単だ。 node_modulesのグローバル空間にインストールするため抵抗がある人もいるかもしれないが、その場合適宜工夫してもらいたい。基本的にコマンドラインツールとして使うので、筆者はあまり問題ないと考えているが、バージョン違いによる挙動の差異があり得るため、チームで運用する際はメンバー間でバージョンについて
Angular2でさくっとMEANスタックをはじめてみる | TECHSCORE BLOG | TECHSCORE BLOG
こんにちは、平奥です！ これは、 TECHSCORE Advent Calendar 2016 TECHSCORE BLOG の22日目の記事です。 弊社サービス Synergy! は、 AngularJS で実装されています。 AngularJS はご存知の方も多いとは思いますが、後継バージョンの Angular2 が登場しました。 Angular2 は AngularJS の問題点が整理されました。その結果、使いやすく、そしてパフォーマンスもものすごく改善されています。 しかし問題点もあります。 AngularJS との互換性がありません。 そのため Angular2 を動作させるには今まで使用していた AngularJS の環境を使うことはできず、新たに動作させる環境を用意しないといけません。 Plnkr などを使えば簡単に Angular2 の検証はできるのですが、せっかくなら A
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
angular1脳で見るangular2
TechFeedのつくりかた - Angular2/Webpack/Ionic2/Cordova実践入門
hands-on/courses/material-todoapp/README.md at master · ng-japan/hands-on
〜なんだかいけそうな気がする〜Angular入門
GitBook – Knowledge management for technical teams
GitBook