SlideShare uma empresa Scribd logo
1 de 35
Baixar para ler offline
Web TECH FORUM 2017 in 大阪
Webシステム開発と
JavaScript UIコンポーネント
~ WebシステムにおけるUXと開発効率向上への提案 ~
エス・ビー・エス株式会社
第一システム部
須藤 隆一郎
Web TECH FORUM 2017 in 大阪
自己紹介
須藤 隆一郎(すどう りゅういちろう)
• Visual Studio2005から.NETの開発を開始
以降、ローカル・Webの開発経験を交互に半分ずつ
• アプリ機能の共通化/部品化を主に担当
(グレープシティ社製品のカスタマイズもあり、
.NET Frameworkからの自作もあり)
• 現在は、技術導入支援が主な役割
※コンサルとは少し違うと自分では思っています。
Web TECH FORUM 2017 in 大阪
自己紹介
これを導入すれば
こういうメリットが
あって・・・
実際のところどうなの?
どうしたらいいの!?
つまりこういうことで、
御社での開発に
当てはめると実際
にはこういうメリット
があります。
お客様
お客様の上司
これを使うと良
いらしいぞ!
コンサルタント/営業
私
確かにそういったメリットはありますが、
御社の場合はここが特殊なので、
メリットを生かすためにはこういった
課題があります。
Web TECH FORUM 2017 in 大阪
会社概要
商号 エス・ビー・エス株式会社
所在地
〒164-0001
東京都中野区中野3-33-3 インツ中野ビル
創業 1985年3月
従業員 98名(2017年8月現在)
URL http://www.sbsnt.co.jp/
ソフトウェア開発 •受託システム開発 ・パッケージシステム開発 ・運用管理 ・保守サービス
•要件定義 ・基本設計 ・詳細設計 ・DB設計
•運用設計 ・ハードウエア構成設計 ・ネットワーク構成設計
•プログラム設計 ・プログラム開発 ・テスト設計 ・プロジェクト管理
システム
コンサルティング
•最新技術の動向調査 ・分析 ・教育
•システム導入の企画 ・提案
ERP •SAP/GLOVIA導入支援 ・運用管理 ・アドオン開発
【事業内容】
Web TECH FORUM 2017 in 大阪
会社概要
システム構築 基幹系システム構築
WEBアプリケーション構築
情報系システム分析・構築
ERP GLOVIAアドンオン開発
コンサルテーション システム構築コンサルテーション
ERP GLOVIA導入支援
SOX法内部統制コンサルテーション
システム移行
【主なソリューション実績】
運用管理 ERP SAP 運用管理
システム運用管理
システム保守サポート
インフラ ネットワーク ERP SAP/BASIS
ネットワーク構築サービス
サーバー導入支援サービス
その他 ユーザ向けITセミナ
[業種]
[業務]
•運輸・倉庫*
•生命保険
•建設・石油・化学
•鉄鋼・繊維
•ホテル・旅館
•卸・商社*
•製造・小売*
•教育・サービス
•医療・薬品
•通信・広告
•銀行・証券
•受発注管理
•生産管理
•顧客管理
•配送管理
•見積積算
•販売管理
•債権債務管理
•貿易管理
•工程管理
•販売促進
•給与管理
•購買管理
•原材料管理
•財務会計
•車両管理
「*」は特化業種
【取扱業種】
•建築・不動産
•信販・リース*
•損害保険*
•食品・飼料*
•営業支援
•物流管理
•販売管理
•受発注管理
•生産管理
•顧客管理
•配送管理
•見積積算
•営業支援
•物流管理
•在庫管理
•商品管理
•管理会計
•輸送管理
•原価管理
•品質管理
•予約管理
Web TECH FORUM 2017 in 大阪
会社紹介
Web TECH FORUM 2017 in 大阪
会社紹介
Web TECH FORUM 2017 in 大阪
エンジニア比率
Java
.NET
Sales
force
Web TECH FORUM 2017 in 大阪
開発実績
VB6
ASP
VB.NET
VB.NET
WPF
ASP.NET or MVC
ASP.NET
ASP.NET MVCVB.NET
ASP.NET MVC
マイグレーション
WEB化
.Net Framework 1.1 2.0 3.5 4.0 4.5 4.6
※.NET Frameworkはリリースタイミングを記載。
プロダクトのビルドバージョンとは異なります。
Web TECH FORUM 2017 in 大阪
導入実績
製品名
導入
件数
システム事例・業種
ActiveReports for .NET 8 金融系基幹システム、物流システム
SPREAD
(for Windows Forms、ASP.NET)
9 販売管理システム、在庫管理システム
InputMan
(for Windows Forms、ASP.NET)
9 販売管理システム、在庫管理システム
MultiRow for Windows Forms 2 販売管理システム
ComponentOne製品 2 勤怠管理システム
Forguncy 3 資産管理システム
Web TECH FORUM 2017 in 大阪
昨今のマイグレーション
事情
UIコンポーネント利用
の必然性
新要素の無理のない
取り込み方法のご提案
Web TECH FORUM 2017 in 大阪
本日のテーマ①
昨今のマイグレーション事情
Web TECH FORUM 2017 in 大阪
マイグレーションパターン
VB
Windows
Forms
DB
ASP
WebForm
DB
クライアント サーバー
①
②
③
④
⑤
⑥
Web TECH FORUM 2017 in 大阪
マイグレーションパターン(これまで)
WPF
Windows
Forms
VB
WebForm MVC
Windows
Forms
Web TECH FORUM 2017 in 大阪
マイグレーションパターン(最近)
WPF
Windows
Forms
VB
WebForm MVC
(WebAPI)
Windows
Forms
Web TECH FORUM 2017 in 大阪
なぜか
・外部サービス連携のニーズの増加
・社外からのシステムアクセス ニーズの増加
・モバイルデバイスの一般化
WEB化
※人⇔ WEB ⇔システム
※システム⇔ WEB ⇔システム
Web TECH FORUM 2017 in 大阪
おすすめの構成
業務処理
WPF
Windows
Forms
DB
Webサーバー
できる限り業務処理をサーバー側へ
↓
Web TECH FORUM 2017 in 大阪
将来的には
業務処理
Android
ストアアプリ
DB
Webサーバー
できる限り業務処理をサーバー側へ
↓
App
ストアアプリ
Web TECH FORUM 2017 in 大阪
参考事例:WPFアプリケーション構成①
XAML
コードビハインド
(xxx.xaml.vb)
ビジネスロジックA
ドメインモデルA
ビジネスファサード
ビジネスロジックB
ドメインモデルB
ファサードモデル
ビジネスロジックC
ドメインモデルC
コマンド代替定義
バリデーター
ワーカーサービス
ビューモデル
DB
Web TECH FORUM 2017 in 大阪
参考事例:WPFアプリケーション構成②
XAML
コードビハインド
(xxx.xaml.vb)
DB
ビジネスロジックA
ドメインモデルA
ビジネスファサード
ビジネスロジックB
ドメインモデルB
ファサードモデル
ビジネスロジックC
ドメインモデルC
コマンド代替定義
バリデーター
ワーカーサービス
ビューモデル
クライアント サーバー
Web TECH FORUM 2017 in 大阪
本日のテーマ②
UIコンポーネント利用の必然性
Web TECH FORUM 2017 in 大阪
Windows iOSAndroid
7 8.1 10 Galaxy Nexsus 8 X7
その一方で直面しているWEBの課題
Chrome
FireFox
Safari
据え置き モバイル
タッチ
IE/Edge
WebForm
マウス
ペン
如何にテスト効率を上げるか?
Web TECH FORUM 2017 in 大阪
如何にテスト効率を上げるか?
複雑性の排除
Web TECH FORUM 2017 in 大阪
アプリケーションの本質
DB
DB
OR
入力チェック
テーブル
正規化
データ
連携
トランザクション
ログ出力
認証
文字列編集
レスポンシブ
Webデザイン
アニメーション
ブラウザ判定
権限
Web TECH FORUM 2017 in 大阪
同時に色々なことをすると事故りやすい
引用:交通事故総合分析センター「携帯電話等の使用が要因となる事故の分析」
Web TECH FORUM 2017 in 大阪
コンポーネント化(複雑さの集約)
DB
アプリケーションとして本来実装すべき処理は
極力シンプルに保つ
Web TECH FORUM 2017 in 大阪
例えば
Framework O/Rマッパー
DB
アプリケーションとして本来実装すべき処理は
極力シンプルに保つ
Web TECH FORUM 2017 in 大阪
本日のテーマ③
新要素の無理のない
取り込み方法のご提案
Web TECH FORUM 2017 in 大阪
MVCアーキテクチャの活用
Web TECH FORUM 2017 in 大阪
ご紹介するMVCアーキテクチャ
コントローラー
リクエスト
X
出し分け
モデル
ビュー
Y
Web TECH FORUM 2017 in 大阪
活用方法
コントローラー
リクエスト
出し分け
ビュー
New!!
Web TECH FORUM 2017 in 大阪
サンプル解説①
画面A(GammenA)
画面B(GammenB)
Web TECH FORUM 2017 in 大阪
サンプル解説②
画面A
Text1
Text2
Text1
Text2
入力モデル コントローラー
画面B
合計
出力モデル
合計
画面B
テンプレート
画面Bを
指定して出力
計算処理呼出
Web TECH FORUM 2017 in 大阪
サンプル解説③
画面A
Text1
Text2
Text1
Text2
入力モデル コントローラー
画面X
合計
出力モデル
合計
計算処理呼出
画面Xを
指定して出力
画面X
テンプレート
Web TECH FORUM 2017 in 大阪
ご清聴ありがとうございました

Mais conteúdo relacionado

Mais procurados

どうなる?Visual Studioの クライアントサイド web開発の今後
どうなる?Visual Studioの クライアントサイド web開発の今後どうなる?Visual Studioの クライアントサイド web開発の今後
どうなる?Visual Studioの クライアントサイド web開発の今後Narami Kiyokura
 
Swaggerのさわりだけ
SwaggerのさわりだけSwaggerのさわりだけ
SwaggerのさわりだけMasakazu Muraoka
 
いまさら学ぶMVVMパターン
いまさら学ぶMVVMパターンいまさら学ぶMVVMパターン
いまさら学ぶMVVMパターンYuta Matsumura
 
新世代Java scriptコントロール wijmo5 devsumi_150219
新世代Java scriptコントロール wijmo5 devsumi_150219新世代Java scriptコントロール wijmo5 devsumi_150219
新世代Java scriptコントロール wijmo5 devsumi_150219Akiyoshi Yamazaki
 
Java scriptライブラリ「wijmo(ウィジモ)」による日本仕様のUI開発
Java scriptライブラリ「wijmo(ウィジモ)」による日本仕様のUI開発Java scriptライブラリ「wijmo(ウィジモ)」による日本仕様のUI開発
Java scriptライブラリ「wijmo(ウィジモ)」による日本仕様のUI開発Akiyoshi Yamazaki
 
【デブサミ関西C4】JavaScriptライブラリ Wijmo[ウィジモ]ご紹介
【デブサミ関西C4】JavaScriptライブラリ Wijmo[ウィジモ]ご紹介【デブサミ関西C4】JavaScriptライブラリ Wijmo[ウィジモ]ご紹介
【デブサミ関西C4】JavaScriptライブラリ Wijmo[ウィジモ]ご紹介Developers Summit
 
Web屋という仕事のこれから Web動向からWeb屋に必要な技術を考えてみる
Web屋という仕事のこれから Web動向からWeb屋に必要な技術を考えてみるWeb屋という仕事のこれから Web動向からWeb屋に必要な技術を考えてみる
Web屋という仕事のこれから Web動向からWeb屋に必要な技術を考えてみるMasakazu Muraoka
 
Visual Studio 2017 事はじめ
Visual Studio 2017 事はじめVisual Studio 2017 事はじめ
Visual Studio 2017 事はじめHideaki Aoyagi
 
react-jsonschema-formについて
react-jsonschema-formについてreact-jsonschema-formについて
react-jsonschema-formについてMasakazu Muraoka
 
JS非同期処理のいま
JS非同期処理のいまJS非同期処理のいま
JS非同期処理のいまMasakazu Muraoka
 
“なめらか”なメトロスタイルアプリを作るために ~WinRT の非同期性を活用したアプリ開発~
“なめらか”なメトロスタイルアプリを作るために ~WinRT の非同期性を活用したアプリ開発~“なめらか”なメトロスタイルアプリを作るために ~WinRT の非同期性を活用したアプリ開発~
“なめらか”なメトロスタイルアプリを作るために ~WinRT の非同期性を活用したアプリ開発~ShinichiAoyagi
 
【18-C-5】C# で iOS/Androidアプリ開発 - Visual Studio 2015 + Xamarin + MVVMCross -
【18-C-5】C# で iOS/Androidアプリ開発 - Visual Studio 2015 + Xamarin + MVVMCross -【18-C-5】C# で iOS/Androidアプリ開発 - Visual Studio 2015 + Xamarin + MVVMCross -
【18-C-5】C# で iOS/Androidアプリ開発 - Visual Studio 2015 + Xamarin + MVVMCross -ShinichiAoyagi
 
モダンWeb開発ワークショップ
モダンWeb開発ワークショップモダンWeb開発ワークショップ
モダンWeb開発ワークショップStaffnet_Inc
 
2010-10-2 FxUG 名古屋勉強会 HTML5で遊んでみよう
2010-10-2 FxUG 名古屋勉強会 HTML5で遊んでみよう2010-10-2 FxUG 名古屋勉強会 HTML5で遊んでみよう
2010-10-2 FxUG 名古屋勉強会 HTML5で遊んでみようMori Shingo
 
Mozapps installがなくなったことへの不平不満
Mozapps installがなくなったことへの不平不満Mozapps installがなくなったことへの不平不満
Mozapps installがなくなったことへの不平不満Masakazu Muraoka
 
フロントエンド初学者がSPAに手を出してみた
フロントエンド初学者がSPAに手を出してみたフロントエンド初学者がSPAに手を出してみた
フロントエンド初学者がSPAに手を出してみたKei Yagi
 
イマドキのフロントエンドエンジニアの道具箱
イマドキのフロントエンドエンジニアの道具箱イマドキのフロントエンドエンジニアの道具箱
イマドキのフロントエンドエンジニアの道具箱Fumio SAGAWA
 

Mais procurados (20)

どうなる?Visual Studioの クライアントサイド web開発の今後
どうなる?Visual Studioの クライアントサイド web開発の今後どうなる?Visual Studioの クライアントサイド web開発の今後
どうなる?Visual Studioの クライアントサイド web開発の今後
 
Swaggerのさわりだけ
SwaggerのさわりだけSwaggerのさわりだけ
Swaggerのさわりだけ
 
いまさら学ぶMVVMパターン
いまさら学ぶMVVMパターンいまさら学ぶMVVMパターン
いまさら学ぶMVVMパターン
 
新世代Java scriptコントロール wijmo5 devsumi_150219
新世代Java scriptコントロール wijmo5 devsumi_150219新世代Java scriptコントロール wijmo5 devsumi_150219
新世代Java scriptコントロール wijmo5 devsumi_150219
 
Java scriptライブラリ「wijmo(ウィジモ)」による日本仕様のUI開発
Java scriptライブラリ「wijmo(ウィジモ)」による日本仕様のUI開発Java scriptライブラリ「wijmo(ウィジモ)」による日本仕様のUI開発
Java scriptライブラリ「wijmo(ウィジモ)」による日本仕様のUI開発
 
【デブサミ関西C4】JavaScriptライブラリ Wijmo[ウィジモ]ご紹介
【デブサミ関西C4】JavaScriptライブラリ Wijmo[ウィジモ]ご紹介【デブサミ関西C4】JavaScriptライブラリ Wijmo[ウィジモ]ご紹介
【デブサミ関西C4】JavaScriptライブラリ Wijmo[ウィジモ]ご紹介
 
Web屋という仕事のこれから Web動向からWeb屋に必要な技術を考えてみる
Web屋という仕事のこれから Web動向からWeb屋に必要な技術を考えてみるWeb屋という仕事のこれから Web動向からWeb屋に必要な技術を考えてみる
Web屋という仕事のこれから Web動向からWeb屋に必要な技術を考えてみる
 
Visual Studio 2017 事はじめ
Visual Studio 2017 事はじめVisual Studio 2017 事はじめ
Visual Studio 2017 事はじめ
 
react-jsonschema-formについて
react-jsonschema-formについてreact-jsonschema-formについて
react-jsonschema-formについて
 
JS非同期処理のいま
JS非同期処理のいまJS非同期処理のいま
JS非同期処理のいま
 
“なめらか”なメトロスタイルアプリを作るために ~WinRT の非同期性を活用したアプリ開発~
“なめらか”なメトロスタイルアプリを作るために ~WinRT の非同期性を活用したアプリ開発~“なめらか”なメトロスタイルアプリを作るために ~WinRT の非同期性を活用したアプリ開発~
“なめらか”なメトロスタイルアプリを作るために ~WinRT の非同期性を活用したアプリ開発~
 
【18-C-5】C# で iOS/Androidアプリ開発 - Visual Studio 2015 + Xamarin + MVVMCross -
【18-C-5】C# で iOS/Androidアプリ開発 - Visual Studio 2015 + Xamarin + MVVMCross -【18-C-5】C# で iOS/Androidアプリ開発 - Visual Studio 2015 + Xamarin + MVVMCross -
【18-C-5】C# で iOS/Androidアプリ開発 - Visual Studio 2015 + Xamarin + MVVMCross -
 
モダンWeb開発ワークショップ
モダンWeb開発ワークショップモダンWeb開発ワークショップ
モダンWeb開発ワークショップ
 
React.js + Flux
React.js + FluxReact.js + Flux
React.js + Flux
 
2010-10-2 FxUG 名古屋勉強会 HTML5で遊んでみよう
2010-10-2 FxUG 名古屋勉強会 HTML5で遊んでみよう2010-10-2 FxUG 名古屋勉強会 HTML5で遊んでみよう
2010-10-2 FxUG 名古屋勉強会 HTML5で遊んでみよう
 
Fetch apiについて
Fetch apiについてFetch apiについて
Fetch apiについて
 
Espruinoの紹介
Espruinoの紹介Espruinoの紹介
Espruinoの紹介
 
Mozapps installがなくなったことへの不平不満
Mozapps installがなくなったことへの不平不満Mozapps installがなくなったことへの不平不満
Mozapps installがなくなったことへの不平不満
 
フロントエンド初学者がSPAに手を出してみた
フロントエンド初学者がSPAに手を出してみたフロントエンド初学者がSPAに手を出してみた
フロントエンド初学者がSPAに手を出してみた
 
イマドキのフロントエンドエンジニアの道具箱
イマドキのフロントエンドエンジニアの道具箱イマドキのフロントエンドエンジニアの道具箱
イマドキのフロントエンドエンジニアの道具箱
 

Semelhante a 【Web TECH FORUM 2017 in大阪】Webシステム開発とJavaScript UIコンポーネント

マイクロソフトWeb開発の今と今後
マイクロソフトWeb開発の今と今後マイクロソフトWeb開発の今と今後
マイクロソフトWeb開発の今と今後Akira Inoue
 
[TL04] .NET 15 周年の今こそ考えるクラウドネイティブ アプリケーションと .NET の活用
[TL04] .NET 15 周年の今こそ考えるクラウドネイティブ アプリケーションと .NET の活用[TL04] .NET 15 周年の今こそ考えるクラウドネイティブ アプリケーションと .NET の活用
[TL04] .NET 15 周年の今こそ考えるクラウドネイティブ アプリケーションと .NET の活用de:code 2017
 
.NET Coreから概観する.NETのOSSへの取り組み
.NET Coreから概観する.NETのOSSへの取り組み.NET Coreから概観する.NETのOSSへの取り組み
.NET Coreから概観する.NETのOSSへの取り組みKouji Matsui
 
Application development with c#, .net 6, blazor web assembly, asp.net web api...
Application development with c#, .net 6, blazor web assembly, asp.net web api...Application development with c#, .net 6, blazor web assembly, asp.net web api...
Application development with c#, .net 6, blazor web assembly, asp.net web api...Shotaro Suzuki
 
~初心者がこれから Web アプリの開発をするために~
~初心者がこれから Web アプリの開発をするために~~初心者がこれから Web アプリの開発をするために~
~初心者がこれから Web アプリの開発をするために~Oda Shinsuke
 
Application development with c#, .net 6, blazor web assembly, asp.net web api...
Application development with c#, .net 6, blazor web assembly, asp.net web api...Application development with c#, .net 6, blazor web assembly, asp.net web api...
Application development with c#, .net 6, blazor web assembly, asp.net web api...Shotaro Suzuki
 
Application development with c#, .net 6, blazor web assembly, asp.net web api...
Application development with c#, .net 6, blazor web assembly, asp.net web api...Application development with c#, .net 6, blazor web assembly, asp.net web api...
Application development with c#, .net 6, blazor web assembly, asp.net web api...Shotaro Suzuki
 
Silverlightを囲む会in大阪#19
Silverlightを囲む会in大阪#19Silverlightを囲む会in大阪#19
Silverlightを囲む会in大阪#19Atsuo Yamasaki
 
Php conference 2010 final
Php conference 2010 finalPhp conference 2010 final
Php conference 2010 finalhirookun
 
One ASP.NET ~ 今、ASP.NET に何が起こっているのか? ~
One ASP.NET ~ 今、ASP.NET に何が起こっているのか? ~One ASP.NET ~ 今、ASP.NET に何が起こっているのか? ~
One ASP.NET ~ 今、ASP.NET に何が起こっているのか? ~Akira Inoue
 
Application development with c#, .net 6, blazor web assembly, asp.net web api...
Application development with c#, .net 6, blazor web assembly, asp.net web api...Application development with c#, .net 6, blazor web assembly, asp.net web api...
Application development with c#, .net 6, blazor web assembly, asp.net web api...Shotaro Suzuki
 
ASP.NET vNext / Visual Studio "14" に見る .NET の未来像
ASP.NET vNext / Visual Studio "14" に見る .NET の未来像ASP.NET vNext / Visual Studio "14" に見る .NET の未来像
ASP.NET vNext / Visual Studio "14" に見る .NET の未来像Akira Inoue
 
[公開用]Netラボ2012年2月勉強会 asp.netmvc4 beta新機能の紹介
[公開用]Netラボ2012年2月勉強会 asp.netmvc4 beta新機能の紹介[公開用]Netラボ2012年2月勉強会 asp.netmvc4 beta新機能の紹介
[公開用]Netラボ2012年2月勉強会 asp.netmvc4 beta新機能の紹介david9142
 
Php on windows vol.2 - session.1 - 公開用
Php on windows   vol.2 - session.1 - 公開用Php on windows   vol.2 - session.1 - 公開用
Php on windows vol.2 - session.1 - 公開用hirookun
 
_WEB の作業が楽になるテクニック総まとめ 第7回
_WEB の作業が楽になるテクニック総まとめ 第7回_WEB の作業が楽になるテクニック総まとめ 第7回
_WEB の作業が楽になるテクニック総まとめ 第7回Kelly Holonic
 

Semelhante a 【Web TECH FORUM 2017 in大阪】Webシステム開発とJavaScript UIコンポーネント (20)

【Web TECH FORUM 2017 in大阪】JavaScript UIコンポーネント の選定と活用ポイント
【Web TECH FORUM 2017 in大阪】JavaScript UIコンポーネント の選定と活用ポイント【Web TECH FORUM 2017 in大阪】JavaScript UIコンポーネント の選定と活用ポイント
【Web TECH FORUM 2017 in大阪】JavaScript UIコンポーネント の選定と活用ポイント
 
マイクロソフトWeb開発の今と今後
マイクロソフトWeb開発の今と今後マイクロソフトWeb開発の今と今後
マイクロソフトWeb開発の今と今後
 
[TL04] .NET 15 周年の今こそ考えるクラウドネイティブ アプリケーションと .NET の活用
[TL04] .NET 15 周年の今こそ考えるクラウドネイティブ アプリケーションと .NET の活用[TL04] .NET 15 周年の今こそ考えるクラウドネイティブ アプリケーションと .NET の活用
[TL04] .NET 15 周年の今こそ考えるクラウドネイティブ アプリケーションと .NET の活用
 
.NET Coreから概観する.NETのOSSへの取り組み
.NET Coreから概観する.NETのOSSへの取り組み.NET Coreから概観する.NETのOSSへの取り組み
.NET Coreから概観する.NETのOSSへの取り組み
 
Application development with c#, .net 6, blazor web assembly, asp.net web api...
Application development with c#, .net 6, blazor web assembly, asp.net web api...Application development with c#, .net 6, blazor web assembly, asp.net web api...
Application development with c#, .net 6, blazor web assembly, asp.net web api...
 
~初心者がこれから Web アプリの開発をするために~
~初心者がこれから Web アプリの開発をするために~~初心者がこれから Web アプリの開発をするために~
~初心者がこれから Web アプリの開発をするために~
 
Application development with c#, .net 6, blazor web assembly, asp.net web api...
Application development with c#, .net 6, blazor web assembly, asp.net web api...Application development with c#, .net 6, blazor web assembly, asp.net web api...
Application development with c#, .net 6, blazor web assembly, asp.net web api...
 
Application development with c#, .net 6, blazor web assembly, asp.net web api...
Application development with c#, .net 6, blazor web assembly, asp.net web api...Application development with c#, .net 6, blazor web assembly, asp.net web api...
Application development with c#, .net 6, blazor web assembly, asp.net web api...
 
Silverlightを囲む会in大阪#19
Silverlightを囲む会in大阪#19Silverlightを囲む会in大阪#19
Silverlightを囲む会in大阪#19
 
Php conference 2010 final
Php conference 2010 finalPhp conference 2010 final
Php conference 2010 final
 
Web matrix2とvisual studio
Web matrix2とvisual studioWeb matrix2とvisual studio
Web matrix2とvisual studio
 
One ASP.NET ~ 今、ASP.NET に何が起こっているのか? ~
One ASP.NET ~ 今、ASP.NET に何が起こっているのか? ~One ASP.NET ~ 今、ASP.NET に何が起こっているのか? ~
One ASP.NET ~ 今、ASP.NET に何が起こっているのか? ~
 
Application development with c#, .net 6, blazor web assembly, asp.net web api...
Application development with c#, .net 6, blazor web assembly, asp.net web api...Application development with c#, .net 6, blazor web assembly, asp.net web api...
Application development with c#, .net 6, blazor web assembly, asp.net web api...
 
ASP.NET vNext / Visual Studio "14" に見る .NET の未来像
ASP.NET vNext / Visual Studio "14" に見る .NET の未来像ASP.NET vNext / Visual Studio "14" に見る .NET の未来像
ASP.NET vNext / Visual Studio "14" に見る .NET の未来像
 
20140322
2014032220140322
20140322
 
20100218
2010021820100218
20100218
 
[公開用]Netラボ2012年2月勉強会 asp.netmvc4 beta新機能の紹介
[公開用]Netラボ2012年2月勉強会 asp.netmvc4 beta新機能の紹介[公開用]Netラボ2012年2月勉強会 asp.netmvc4 beta新機能の紹介
[公開用]Netラボ2012年2月勉強会 asp.netmvc4 beta新機能の紹介
 
Php on windows vol.2 - session.1 - 公開用
Php on windows   vol.2 - session.1 - 公開用Php on windows   vol.2 - session.1 - 公開用
Php on windows vol.2 - session.1 - 公開用
 
[Japan Tech summit 2017] APP 001
[Japan Tech summit 2017] APP 001[Japan Tech summit 2017] APP 001
[Japan Tech summit 2017] APP 001
 
_WEB の作業が楽になるテクニック総まとめ 第7回
_WEB の作業が楽になるテクニック総まとめ 第7回_WEB の作業が楽になるテクニック総まとめ 第7回
_WEB の作業が楽になるテクニック総まとめ 第7回
 

Mais de Developer Solutions事業部 メシウス株式会社 (旧グレープシティ株式会社)

Mais de Developer Solutions事業部 メシウス株式会社 (旧グレープシティ株式会社) (20)

Angularを利用したシステム開発事例
Angularを利用したシステム開発事例Angularを利用したシステム開発事例
Angularを利用したシステム開発事例
 
SPAを選択した理由とその結果 ~Reactを添えて~
SPAを選択した理由とその結果 ~Reactを添えて~SPAを選択した理由とその結果 ~Reactを添えて~
SPAを選択した理由とその結果 ~Reactを添えて~
 
グレープシティ製品からみるSPA開発のトレンドと動向
グレープシティ製品からみるSPA開発のトレンドと動向グレープシティ製品からみるSPA開発のトレンドと動向
グレープシティ製品からみるSPA開発のトレンドと動向
 
日常使っているツールを調べる ー Visual Studio Code について ー
日常使っているツールを調べる ー Visual Studio Code について ー日常使っているツールを調べる ー Visual Studio Code について ー
日常使っているツールを調べる ー Visual Studio Code について ー
 
[GrapeCity Web TECH FORUM 2018]レガシーからの移行 - 株式会社日本プロテック
[GrapeCity Web TECH FORUM 2018]レガシーからの移行 - 株式会社日本プロテック[GrapeCity Web TECH FORUM 2018]レガシーからの移行 - 株式会社日本プロテック
[GrapeCity Web TECH FORUM 2018]レガシーからの移行 - 株式会社日本プロテック
 
[GrapeCity Web TECH FORUM 2018]グレープシティJavaScript製品のご紹介 活用のコツと開発のポイント
[GrapeCity Web TECH FORUM 2018]グレープシティJavaScript製品のご紹介 活用のコツと開発のポイント[GrapeCity Web TECH FORUM 2018]グレープシティJavaScript製品のご紹介 活用のコツと開発のポイント
[GrapeCity Web TECH FORUM 2018]グレープシティJavaScript製品のご紹介 活用のコツと開発のポイント
 
グレープシティと業務システム開発のモダナイゼーション
グレープシティと業務システム開発のモダナイゼーショングレープシティと業務システム開発のモダナイゼーション
グレープシティと業務システム開発のモダナイゼーション
 
.NET CoreアプリでWindowsの外に出発
.NET CoreアプリでWindowsの外に出発.NET CoreアプリでWindowsの外に出発
.NET CoreアプリでWindowsの外に出発
 
Webアプリの向こうに見えるPWAアプリ開発
Webアプリの向こうに見えるPWAアプリ開発Webアプリの向こうに見えるPWAアプリ開発
Webアプリの向こうに見えるPWAアプリ開発
 
クロスプラットフォームの夢をみる
クロスプラットフォームの夢をみるクロスプラットフォームの夢をみる
クロスプラットフォームの夢をみる
 
Toolsの杜 - 富士通九州システムズ&グレープシティ -「これまでの業務アプリケーションはどうなる?」
Toolsの杜 - 富士通九州システムズ&グレープシティ -「これまでの業務アプリケーションはどうなる?」Toolsの杜 - 富士通九州システムズ&グレープシティ -「これまでの業務アプリケーションはどうなる?」
Toolsの杜 - 富士通九州システムズ&グレープシティ -「これまでの業務アプリケーションはどうなる?」
 
Toolsの杜 - ランチセッションB - HTML5時代の業務アプリケーション開発にマッチ!グレープシティ JavaScript製品のご紹介
Toolsの杜 - ランチセッションB - HTML5時代の業務アプリケーション開発にマッチ!グレープシティ JavaScript製品のご紹介Toolsの杜 - ランチセッションB - HTML5時代の業務アプリケーション開発にマッチ!グレープシティ JavaScript製品のご紹介
Toolsの杜 - ランチセッションB - HTML5時代の業務アプリケーション開発にマッチ!グレープシティ JavaScript製品のご紹介
 
Toolsの杜- 弥生株式会社の自動仕訳エンジンを支えるフロントエンド ~ 「ダサいは、バグだ!」を標榜してUXを徹底的に追求する ~
Toolsの杜- 弥生株式会社の自動仕訳エンジンを支えるフロントエンド ~ 「ダサいは、バグだ!」を標榜してUXを徹底的に追求する ~Toolsの杜- 弥生株式会社の自動仕訳エンジンを支えるフロントエンド ~ 「ダサいは、バグだ!」を標榜してUXを徹底的に追求する ~
Toolsの杜- 弥生株式会社の自動仕訳エンジンを支えるフロントエンド ~ 「ダサいは、バグだ!」を標榜してUXを徹底的に追求する ~
 
Toolsの杜 - ランチセッションA - Microsoftの開発環境の変遷とグレープシティの.NET開発支援コンポーネントの最新動向
Toolsの杜 - ランチセッションA - Microsoftの開発環境の変遷とグレープシティの.NET開発支援コンポーネントの最新動向Toolsの杜 - ランチセッションA - Microsoftの開発環境の変遷とグレープシティの.NET開発支援コンポーネントの最新動向
Toolsの杜 - ランチセッションA - Microsoftの開発環境の変遷とグレープシティの.NET開発支援コンポーネントの最新動向
 
Toolsの杜 - マーベリック - 「IT×デザイン」のススメ
Toolsの杜 - マーベリック - 「IT×デザイン」のススメToolsの杜 - マーベリック - 「IT×デザイン」のススメ
Toolsの杜 - マーベリック - 「IT×デザイン」のススメ
 
Excel業務をWebアプリに!コンポーネントベンダーが眺めたフロントエンド開発
Excel業務をWebアプリに!コンポーネントベンダーが眺めたフロントエンド開発Excel業務をWebアプリに!コンポーネントベンダーが眺めたフロントエンド開発
Excel業務をWebアプリに!コンポーネントベンダーが眺めたフロントエンド開発
 
グレープシティのMicrosoft Azure対応への取り組み
グレープシティのMicrosoft Azure対応への取り組みグレープシティのMicrosoft Azure対応への取り組み
グレープシティのMicrosoft Azure対応への取り組み
 
進化する帳票開発ツール「ActiveReports」の最新機能のご紹介
進化する帳票開発ツール「ActiveReports」の最新機能のご紹介進化する帳票開発ツール「ActiveReports」の最新機能のご紹介
進化する帳票開発ツール「ActiveReports」の最新機能のご紹介
 
ActiveReports、20年の歩みとその魅力
ActiveReports、20年の歩みとその魅力ActiveReports、20年の歩みとその魅力
ActiveReports、20年の歩みとその魅力
 
Xamarinを利用したアプリ開発
Xamarinを利用したアプリ開発Xamarinを利用したアプリ開発
Xamarinを利用したアプリ開発
 

Último

LoRaWANスマート距離検出センサー DS20L カタログ LiDARデバイス
LoRaWANスマート距離検出センサー  DS20L  カタログ  LiDARデバイスLoRaWANスマート距離検出センサー  DS20L  カタログ  LiDARデバイス
LoRaWANスマート距離検出センサー DS20L カタログ LiDARデバイスCRI Japan, Inc.
 
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)NTT DATA Technology & Innovation
 
Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。iPride Co., Ltd.
 
LoRaWAN スマート距離検出デバイスDS20L日本語マニュアル
LoRaWAN スマート距離検出デバイスDS20L日本語マニュアルLoRaWAN スマート距離検出デバイスDS20L日本語マニュアル
LoRaWAN スマート距離検出デバイスDS20L日本語マニュアルCRI Japan, Inc.
 
新人研修 後半 2024/04/26の勉強会で発表されたものです。
新人研修 後半        2024/04/26の勉強会で発表されたものです。新人研修 後半        2024/04/26の勉強会で発表されたものです。
新人研修 後半 2024/04/26の勉強会で発表されたものです。iPride Co., Ltd.
 
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)Hiroshi Tomioka
 
Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。iPride Co., Ltd.
 

Último (7)

LoRaWANスマート距離検出センサー DS20L カタログ LiDARデバイス
LoRaWANスマート距離検出センサー  DS20L  カタログ  LiDARデバイスLoRaWANスマート距離検出センサー  DS20L  カタログ  LiDARデバイス
LoRaWANスマート距離検出センサー DS20L カタログ LiDARデバイス
 
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
 
Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。
 
LoRaWAN スマート距離検出デバイスDS20L日本語マニュアル
LoRaWAN スマート距離検出デバイスDS20L日本語マニュアルLoRaWAN スマート距離検出デバイスDS20L日本語マニュアル
LoRaWAN スマート距離検出デバイスDS20L日本語マニュアル
 
新人研修 後半 2024/04/26の勉強会で発表されたものです。
新人研修 後半        2024/04/26の勉強会で発表されたものです。新人研修 後半        2024/04/26の勉強会で発表されたものです。
新人研修 後半 2024/04/26の勉強会で発表されたものです。
 
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)
 
Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。
 

【Web TECH FORUM 2017 in大阪】Webシステム開発とJavaScript UIコンポーネント

  • 1. Web TECH FORUM 2017 in 大阪 Webシステム開発と JavaScript UIコンポーネント ~ WebシステムにおけるUXと開発効率向上への提案 ~ エス・ビー・エス株式会社 第一システム部 須藤 隆一郎
  • 2. Web TECH FORUM 2017 in 大阪 自己紹介 須藤 隆一郎(すどう りゅういちろう) • Visual Studio2005から.NETの開発を開始 以降、ローカル・Webの開発経験を交互に半分ずつ • アプリ機能の共通化/部品化を主に担当 (グレープシティ社製品のカスタマイズもあり、 .NET Frameworkからの自作もあり) • 現在は、技術導入支援が主な役割 ※コンサルとは少し違うと自分では思っています。
  • 3. Web TECH FORUM 2017 in 大阪 自己紹介 これを導入すれば こういうメリットが あって・・・ 実際のところどうなの? どうしたらいいの!? つまりこういうことで、 御社での開発に 当てはめると実際 にはこういうメリット があります。 お客様 お客様の上司 これを使うと良 いらしいぞ! コンサルタント/営業 私 確かにそういったメリットはありますが、 御社の場合はここが特殊なので、 メリットを生かすためにはこういった 課題があります。
  • 4. Web TECH FORUM 2017 in 大阪 会社概要 商号 エス・ビー・エス株式会社 所在地 〒164-0001 東京都中野区中野3-33-3 インツ中野ビル 創業 1985年3月 従業員 98名(2017年8月現在) URL http://www.sbsnt.co.jp/ ソフトウェア開発 •受託システム開発 ・パッケージシステム開発 ・運用管理 ・保守サービス •要件定義 ・基本設計 ・詳細設計 ・DB設計 •運用設計 ・ハードウエア構成設計 ・ネットワーク構成設計 •プログラム設計 ・プログラム開発 ・テスト設計 ・プロジェクト管理 システム コンサルティング •最新技術の動向調査 ・分析 ・教育 •システム導入の企画 ・提案 ERP •SAP/GLOVIA導入支援 ・運用管理 ・アドオン開発 【事業内容】
  • 5. Web TECH FORUM 2017 in 大阪 会社概要 システム構築 基幹系システム構築 WEBアプリケーション構築 情報系システム分析・構築 ERP GLOVIAアドンオン開発 コンサルテーション システム構築コンサルテーション ERP GLOVIA導入支援 SOX法内部統制コンサルテーション システム移行 【主なソリューション実績】 運用管理 ERP SAP 運用管理 システム運用管理 システム保守サポート インフラ ネットワーク ERP SAP/BASIS ネットワーク構築サービス サーバー導入支援サービス その他 ユーザ向けITセミナ [業種] [業務] •運輸・倉庫* •生命保険 •建設・石油・化学 •鉄鋼・繊維 •ホテル・旅館 •卸・商社* •製造・小売* •教育・サービス •医療・薬品 •通信・広告 •銀行・証券 •受発注管理 •生産管理 •顧客管理 •配送管理 •見積積算 •販売管理 •債権債務管理 •貿易管理 •工程管理 •販売促進 •給与管理 •購買管理 •原材料管理 •財務会計 •車両管理 「*」は特化業種 【取扱業種】 •建築・不動産 •信販・リース* •損害保険* •食品・飼料* •営業支援 •物流管理 •販売管理 •受発注管理 •生産管理 •顧客管理 •配送管理 •見積積算 •営業支援 •物流管理 •在庫管理 •商品管理 •管理会計 •輸送管理 •原価管理 •品質管理 •予約管理
  • 6. Web TECH FORUM 2017 in 大阪 会社紹介
  • 7. Web TECH FORUM 2017 in 大阪 会社紹介
  • 8. Web TECH FORUM 2017 in 大阪 エンジニア比率 Java .NET Sales force
  • 9. Web TECH FORUM 2017 in 大阪 開発実績 VB6 ASP VB.NET VB.NET WPF ASP.NET or MVC ASP.NET ASP.NET MVCVB.NET ASP.NET MVC マイグレーション WEB化 .Net Framework 1.1 2.0 3.5 4.0 4.5 4.6 ※.NET Frameworkはリリースタイミングを記載。 プロダクトのビルドバージョンとは異なります。
  • 10. Web TECH FORUM 2017 in 大阪 導入実績 製品名 導入 件数 システム事例・業種 ActiveReports for .NET 8 金融系基幹システム、物流システム SPREAD (for Windows Forms、ASP.NET) 9 販売管理システム、在庫管理システム InputMan (for Windows Forms、ASP.NET) 9 販売管理システム、在庫管理システム MultiRow for Windows Forms 2 販売管理システム ComponentOne製品 2 勤怠管理システム Forguncy 3 資産管理システム
  • 11. Web TECH FORUM 2017 in 大阪 昨今のマイグレーション 事情 UIコンポーネント利用 の必然性 新要素の無理のない 取り込み方法のご提案
  • 12. Web TECH FORUM 2017 in 大阪 本日のテーマ① 昨今のマイグレーション事情
  • 13. Web TECH FORUM 2017 in 大阪 マイグレーションパターン VB Windows Forms DB ASP WebForm DB クライアント サーバー ① ② ③ ④ ⑤ ⑥
  • 14. Web TECH FORUM 2017 in 大阪 マイグレーションパターン(これまで) WPF Windows Forms VB WebForm MVC Windows Forms
  • 15. Web TECH FORUM 2017 in 大阪 マイグレーションパターン(最近) WPF Windows Forms VB WebForm MVC (WebAPI) Windows Forms
  • 16. Web TECH FORUM 2017 in 大阪 なぜか ・外部サービス連携のニーズの増加 ・社外からのシステムアクセス ニーズの増加 ・モバイルデバイスの一般化 WEB化 ※人⇔ WEB ⇔システム ※システム⇔ WEB ⇔システム
  • 17. Web TECH FORUM 2017 in 大阪 おすすめの構成 業務処理 WPF Windows Forms DB Webサーバー できる限り業務処理をサーバー側へ ↓
  • 18. Web TECH FORUM 2017 in 大阪 将来的には 業務処理 Android ストアアプリ DB Webサーバー できる限り業務処理をサーバー側へ ↓ App ストアアプリ
  • 19. Web TECH FORUM 2017 in 大阪 参考事例:WPFアプリケーション構成① XAML コードビハインド (xxx.xaml.vb) ビジネスロジックA ドメインモデルA ビジネスファサード ビジネスロジックB ドメインモデルB ファサードモデル ビジネスロジックC ドメインモデルC コマンド代替定義 バリデーター ワーカーサービス ビューモデル DB
  • 20. Web TECH FORUM 2017 in 大阪 参考事例:WPFアプリケーション構成② XAML コードビハインド (xxx.xaml.vb) DB ビジネスロジックA ドメインモデルA ビジネスファサード ビジネスロジックB ドメインモデルB ファサードモデル ビジネスロジックC ドメインモデルC コマンド代替定義 バリデーター ワーカーサービス ビューモデル クライアント サーバー
  • 21. Web TECH FORUM 2017 in 大阪 本日のテーマ② UIコンポーネント利用の必然性
  • 22. Web TECH FORUM 2017 in 大阪 Windows iOSAndroid 7 8.1 10 Galaxy Nexsus 8 X7 その一方で直面しているWEBの課題 Chrome FireFox Safari 据え置き モバイル タッチ IE/Edge WebForm マウス ペン 如何にテスト効率を上げるか?
  • 23. Web TECH FORUM 2017 in 大阪 如何にテスト効率を上げるか? 複雑性の排除
  • 24. Web TECH FORUM 2017 in 大阪 アプリケーションの本質 DB DB OR 入力チェック テーブル 正規化 データ 連携 トランザクション ログ出力 認証 文字列編集 レスポンシブ Webデザイン アニメーション ブラウザ判定 権限
  • 25. Web TECH FORUM 2017 in 大阪 同時に色々なことをすると事故りやすい 引用:交通事故総合分析センター「携帯電話等の使用が要因となる事故の分析」
  • 26. Web TECH FORUM 2017 in 大阪 コンポーネント化(複雑さの集約) DB アプリケーションとして本来実装すべき処理は 極力シンプルに保つ
  • 27. Web TECH FORUM 2017 in 大阪 例えば Framework O/Rマッパー DB アプリケーションとして本来実装すべき処理は 極力シンプルに保つ
  • 28. Web TECH FORUM 2017 in 大阪 本日のテーマ③ 新要素の無理のない 取り込み方法のご提案
  • 29. Web TECH FORUM 2017 in 大阪 MVCアーキテクチャの活用
  • 30. Web TECH FORUM 2017 in 大阪 ご紹介するMVCアーキテクチャ コントローラー リクエスト X 出し分け モデル ビュー Y
  • 31. Web TECH FORUM 2017 in 大阪 活用方法 コントローラー リクエスト 出し分け ビュー New!!
  • 32. Web TECH FORUM 2017 in 大阪 サンプル解説① 画面A(GammenA) 画面B(GammenB)
  • 33. Web TECH FORUM 2017 in 大阪 サンプル解説② 画面A Text1 Text2 Text1 Text2 入力モデル コントローラー 画面B 合計 出力モデル 合計 画面B テンプレート 画面Bを 指定して出力 計算処理呼出
  • 34. Web TECH FORUM 2017 in 大阪 サンプル解説③ 画面A Text1 Text2 Text1 Text2 入力モデル コントローラー 画面X 合計 出力モデル 合計 計算処理呼出 画面Xを 指定して出力 画面X テンプレート
  • 35. Web TECH FORUM 2017 in 大阪 ご清聴ありがとうございました