“職人”エンジニアがお届する、ウェブインパクト公式エンジニアブログ
郡山コアリーダーのnoguchiです。ウェブインパクトで働き始めたころは東京近郊で部屋を借り、東京本社（飯田橋）に通勤をしていましたが、十数年前にノマドワーク制度が導入されるとほぼ同時に地元郡山に戻り、郡山コアを立ち上げました。現在は、コアメンバーのリーダーとして、日々システム開発を行っております。
番長ブログは久々の投稿となりますが、今回、地元郡山市の「開成山公園」で、「レンタルワークスペース」として開放し「ワーケーション」の実験を行うとの情報を聞き、実際に現地に行って、「ワーケーション」を体験してきましたので、その時のレポートを書きたいと思います。
最近、総理大臣となられた菅さんも推奨されている「ワーケーション」。(Work+Vacationをあわせた造語）ですが、ノマドワーク制度が推奨されている弊社であっても一応、上長に確認は怠りませんｗ「ぜひ行ってみたい！」と話したところ、すんなりOKでしたｗ
なんか、私のBlogと化してきている気がしないでも無い今日この頃の東京kです。こんばんにちは。
さて、先日、KFCことケンタッキーフライドチキンのドライブスルーでETC使えるようになったとの噂が社内を駆け巡りました。
Impress Watch さんの記事：
ケンタッキー、ETCで決済できるドライブスルー
当社でも決済がらみの話はよくお話をいただくこともありますし、Feliciaなどを使ったシステムというのも開発したことがあります。なので、社内でも興味津々の人がいたので、早速体験してみました。
番長Blog担当と化している東京kです。こんにちは。
Webがメインの会社なのに、CPUの話題を書いているのはなぜ？という指摘をいただきましたが、今やっていることに近いことを書こうとすると、うっかりすると書いてはいけないことを書きそうなので、そこそこ忙しいときには、全く違う分野の話を書くようにしています。
というわけで、今回もCPUの話でも。
前回のHTTの話で、ちらっとスーパースカラに触れたけれど「スーパースカラって何よ？」という話題が来たので、せっかくなのでその話を。
先の記事で「スーパースカラでCPUが複数の命令を同時に実行できる」とちらっと触れましたが、そもそも、CPUにとって「1つの命令」って何か？というところからの話です。 “スーパースカラとOoOをなんとなく理解する説明” の続きを読む
どうも、最近、久しぶりにWindowsアプリを作っている東京Kです。
昔は、「C言語はいいねぇ」と言いながら
__asm {
PXOR MM1,MM1
：
}
といったコードを書いていた人だったりしますσ(-_-;;;)
そんな私に、最近「ハイパースレッディング(HTT)は意味があるかわからない所詮コアは1つでしょ？」という話を振られたので、せっかくだからブログネタに。
結論から言うと「HTTはオンにすると普通は性能は上がるが、特定条件下では性能が落ちることもあるので、場合によってはOFFにしてもいいかも」です。
なお、本題に行く前に断っておきますが、この記事も「なんとなく仕組みを知ることができればいい」で書いていますので、細かいところは抜きにしています。
Webimpactでは、関東IT健保組合(以下ITS)に加入しています。
ITSは様々な補助が充実していて、その中の一つに保養施設があります。
要するに、ITS健保の加入者だと格安で利用できるホテルです。
先日、直営保養施設の一つである、トスラブ湯沢に泊まる機会があったのですが、想像以上に素晴らしかったので報告します。
なお、気になるお値段ですが1泊2食付きで、一人5500円。幼児は添い寝利用で無料でした。
この値段で、後述の設備。満足感が半端ないですよ。
こんにちは東京Kです。
システムの開発では「CSVファイル出力機能」と言う要望はかなりあります。
しかし、うっかりするとCSVファイルの出力は、日本語しか使えない文字コードであるShiftJISで作ってしまい、中国文字や機種依存文字などを扱うことが出来ないシステムが出来てしまいます。
またShiftJISだと、絵文字や、珍しい人名漢字も結構使えません。
かといって、世界中の文字を表すことが出来る文字コードであるUNICODE(例えばUTF-8)のCSVファイルを作ったとしても、CSVダブルクリックでExcelが起動すると文字化けします。
では、どうすればいいか？
実は意外と簡単で「BOM」を付ければ良いです。
BOMとはByte Order Markの略で、その昔エンディアンが云々・・・
と言う細かい話は置いておいて、かなり雑な説明をすると、UNICODEと一口に言っても数種類あり、それを区別するための情報をファイルの先頭に付けることが出来ます。その情報がBOMです。
日本語のExcelは、BOM無しCSVファイルはShiftJISとして読み込もうとしますが、BOM付きファイルであれば、BOMに従って文字コードを決定してファイルを開きます。
そのため、CSVファイル出力機能を実装する際にBOM付きのUNICODEファイルを生成するようにすると良いです。
一般的にはBOM付きのUTF-8のファイルを作ることになると思いますので、UTF-8のファイルを出力する際に、ファイルの先頭に「0xEF 0xBB 0xBF」の3バイトを付加すればOKです。
こんにちは、東京Kです。
早速本題ですが、インターネットのクラウドサービスを利用している際に、そのサービスからのメールを送ることがあるかと思います。
その際、メールの差出人を、自社のメールアドレスに設定すると迷惑メールになることが比較的よく発生します。
今回は、それを軽減するためのお話です。
なお、今回は、技術者ではない方向けに、多少かみ砕いて説明しており、細かい枝葉の話は入れておりませんので、多少用語の使い方が不正確ですが、その点はご容赦ください。
また、今回の話の後半は、当社のクラウドサービスの話になっておりますが、世の中にあるクラウドサービス全般に言える話ですので参考にしてください。
ご無沙汰しております。
ネットワークエンジニアのsaitoです。
今回こちらの記事を見たことが発端でこの記事を書いてみました。
https://www.nikkei.com/article/DGXMZO58449120U0A420C2TJ3000/
コロナウィルスの影響で、多くの会社がテレワークを急速に始めることになりましたが、
そのために必要なVPN機器が入手できない、という内容です。
マスクも去ることながら、そんなところにも影響があるのか！と驚いたのと同時に、今でも物理装置としてのVPN機器が求められているという事にも驚きました。
当社はIT前提経営のもと2012年よりノマドワーキング・リモートワーク制度を実施しているため、今回のコロナウィルスを発端とした全社的なリモートワークへの移行もスムーズに行えました。
現在はバックオフィスも含め、全員がリモートワークで業務にあたっています。
またVPN装置をはじめ、サーバーや電話などほぼクラウド化しているため、急激な処理能力増にも対応できます。
今回はエンジニアにとっては当たり前の事でも、非エンジニアの方々にこんな方法が使えるというご紹介ができればと思います。
当社は2017年の時点で電話をクラウドPBXによりIP電話化しました。
導入記はこちらをご覧いただければ幸いです。
https://www.webimpact.co.jp/banchoblog/?p=1670
当社ではslack等のチャットツールをメインに利用しており電話の利用は最小限にしていますが、どうしても業務上必要なシーンもあります。
従来の電話はどうしても場所に固定されたツールでしたが、IP電話化したことにより、リモートワークにおいてオフィスにいなくても問題なく業務を遂行できています。
こちらが今回の本題となります。
ノマド・リモートワーク前提の当社としては、VPNは業務遂行のため大変重要なインフラです。
VPNの終端機能はAWS上に構築しています。
当社の場合、多くの社員がリモートワークに移行しても問題無いようVPN性能設計に余裕を持っており、特に性能の逼迫などは発生していませんが、仮に性能が不足してもクラウドのため処理性能をすぐに上げる事が可能です。
また、これから新規でVPN環境が必要になったとしても、例えばAWS環境上でVPN用の環境を作成すれば、素早く利用開始することができます。
専用のVPN機材の調達などは必要ありません。
当社の場合、Pマークの要件のため、VPN装置としてFortiGateのクラウド版を利用しています。
現在は元々アプライアンスとして有名なネットワーク機材のクラウド版も各種出ていますため、慣れ親しんだUIそのままクラウド化ができます。
https://aws.amazon.com/marketplace/pp/Fortinet-Inc-Fortinet-FortiGate-Next-Generation-Fi/B00PCZSWDA
また、現在はAWSマネージドのVPNサービスも登場していますので、こちらを使うのも良いかもしれません。
https://docs.aws.amazon.com/ja_jp/vpn/latest/clientvpn-admin/what-is.html
元々エンジニアは全員ノートパソコンで業務を行っていましたため、どこにいてもVPNへ接続すれば業務ができる環境になっていました。
バックオフィスに関しては一部デスクトップPCでの業務もありましたが、多くはDaaS(Desktop as a Service)へ移行していました。
DaaSはクラウド上にあるパソコンをリモートで利用できる仕組みです。
そのため社外からでもDaaSへ接続すれば社内と同じ環境が使えますので、こちらも比較的スムーズにリモートワークへ移行できました。
当社ではAmazon WorkSpaceを利用してDaaSを実現しています。
https://aws.amazon.com/jp/workspaces/
如何でしたでしょうか。
まだ暫くリモートワーク体勢が続くでしょうし、これを機に平時においてもリモートワークが定着していくものと考えられます。一足先にノマドワーク、リモートワークを導入した当社のノウハウが、少しでも参考になれば幸いです。
たいとるおんりー
・・・では寂しいのですが、それ以外に言うことがない。
大体のことはREADMEに書いてありますし。
https://github.com/webimpact-dev/usc-e-shop-line
経緯としてはREADMEに書いてあるとおり、公開を目標として、社内での勉強の時間を使ってWordpressとWelcartのプラグイン開発を一部の社員が開発したものです。ちなみに、オリジナルの開発者は私ではありません。
で、それなりに有用そうなものが出来たため、公開がためらわれた時期もありますが、そうこうしているうちに、昨年末にWelcartの公式でLINE PAYのプラグインが販売されたので、非公式として公開することになりました。
ぶっちゃけ、公式版の方が機能は多いですので、そちらを使うことをお勧めします。
前述のように公開がためらわれた時期があったせいで、年明けの公開予定となり、さらにコロナの影響で公開作業をする余裕も無く、こんなタイミングで公開です。
それではまた、何かの機会にー
東京コアののムンと申します。
マレーシアクアラルンプール出身です、現在東京に在住しております。
当ブログは自分が担当した当社のアプリ開発の記事を述べています。
宜しくお願い致します。
入社後に初めて上司に任せて頂いた作業は「雲堂」というアプリのiOS版を開発することになりました。 その後、お客様から、新しいバージョンのご依頼があり「新雲堂」プロジェクトが開始しました。今回、アプリを着手するにあたり、どのようなモバイルアプリフレームワークがよいかを、上司やエンジニアたちで検討がされました。その結果、「React Native」を採用することにしました。
Facebookが開発したiOSとAndroidのアプリが作られるJavaScriptのフレームワークです。JavaScript言語一つだけで、OSに関わらず両方のプラットフォームで動くものが作れます。私は当社のReactJSを使っている別の案件をやったことがありましたので、Reactの経験がある人にとって勉強しやすく長い時間が必要ありません。また、JavaScriptはWeb界隈ではよく使う言語なので、他の言語と比べると開発メンバーが集めやすく学習コストも低いです。
React Nativeの公式サイトによるとプロジェクトの作成は「Expo」と「Building Projects with Native Code」の二つの方法があります。最初は「Expo」の方法を使いましたが、仕組と使い方の勉強はかなり時間がかかりますので、「Building Projects with Native Code」の方式でプロジェクトを始めました。
プロジェクトの作成手順は基本的に以下の通りです（macOS端末向け）。
npm install -g react-native-cli
＊「Building Projects with Native Code」の場合は予めXcodeとAndroid Studioのインストールが必要です。
react-native init New_Undo
react-native run-ios
react-native run-android
この二つコマンドどちらを入力しても動くはず、または各プラットフォームのIDEでネイティブ方式のように実行することも可能です。
＊Androidの場合はアプリ起動する前、エミュレータが起動中の状態が必要です。
React Nativeはアプリ起動中でもリロードする機能があります。
React Nativeは基本的にフロントエンドの技術ですが、一部のライブラリを使う時に少しネイティブコードを書くこと場合もあります。ネイティブのコードと言っても、GitHubでそれらのライブラリを作られていた開発者のREADMEに記載があるのでそれに従えば問題ないと思います。
JavaScript開発者が今まで使っていたライブラリはReact Native開発でも適用可能なので、これはJavaScript開発経験がある私にとって優しく親しみがある環境です。この点はReact Native開発において、かなり楽な点だと思います。さらに、Viewのコードを少しだけ変更した場合は再ビルドせず、React NativeのHot reloadingを使うと、コードの変更はシミュレータに伝達され、直ぐ変更後の結果が確認できます。海外だけでなく、日本国内にもReact Nativeのコミュニティが拡がっています。国内は勉強会が常に行っていて、問題に直面し悩む時に、世界中の開発者と意見を交換したり手伝って貰ったりできます。
意外にReact Nativeのアプリを開発する時に足りない部分が多いです。iOSは充実していますが、Android側の方が少なく、コンポーネントが両方でも対応できるライブラリを追加しなければいけないです。例えば、各プラットフォームのUIを補助したければ、UIコンポーネントがまとまった「Native Base」を使います。但し、開発中はライブラリを入れすぎましたら、将来的にどのライブラリがメンテナンスするか、結構大変だと思います。
元々React Nativeは生JavaScript用に開発されましたが、今回は型付きのTypeScriptを使うことにしました。TypeScriptでコードを書くと、当社の他のエンジニアにとってコードを読みやすくなり、良くないコードを未然に防げます。これは将来のプロジェクトメンテナンスに対して、非常に便利で有利です。今回は、TypeScriptを導入する方法として「react-native-typescript-transformer」というライブラリを使いました。
「雲堂」の開発で使っている主なライブラリは以下の通りです：
React Nativeを使う時に注意しなければいけないこともあります。個人の開発体験によって簡単に説明します。
相応しい高質なライブラリを選ぶことは検討が必要です。例えば、不具合の発生が多かったり頻繁にメンテナンスしていないライブラリは開発者にとって少し不安があります。他の開発者が勧める人気があるライブラリを採用した方がいいです。その上、ライブラリの使い方がドキュメントではっきり書いてあることも重要です。
端末によって縦横の大きさは違いますので、UIが崩れる場合があります。タブレットとやスマホに関わらず、ユーザに快適なアプリ体験をさせるため、違和感がないUIを表示することは大事です。
XcodeやAndroid Studioを用いたネイティブ開発と違って、Interface Builderや、画面遷移を定義できるツールなどは提供されていません。なので、画面のナビゲーションやデータの渡し方はどういう風に動作するかわかりにくいです。開発を始める前に、予め画面遷移のモックアップを設計した方がいいと思います。それをしなければ、アプリの規模が大きくなると各画面の対応が難しくなってしまいます。
プロジェクト作成の最初は垂直分割の構造でしたが、ファイルが散らかっていて、大規模な構成になった時に管理しづらく大変です。水平分割の構造をすると、ファイルがページごとのディレクトリ配下にまとめて管理しやすくなります。ファイルの役割もわかりやすいし、プロジェクトの構造も整理整頓に見えます。
近年ではReact Nativeの人気が上がっていますので、経験がある開発者は結構多いです。雲堂の基本実装は二週間程をかかりました。開発完了の時間は思ったより早かったです。自分のフロントエンド能力はあまり得意ではなく、一番難しかったところはReact NativeのLayoutを調整することです。コードから反映した結果は各プラットフォームのUI表示が異なる場合がよく発生します。それだけでなく、アプリの状態管理「Redux」の実装も上手くいかなかったです。公式ドキュメントを読んでも、その仕組をなかなか理解できませんでした。しかし、実際にコードを書くことによって理解することができました。
初めてクロスプラットフォームのアプリを作ったので、開発の過程で色々な知識を身につけました。特にTypeScriptの書き方やデータの状態管理は元々私がやったことがなかったものです。React Nativeを全く触ったことがない私にとっては今回のアプリが作れたことはすごく達成感があります。