こんにちは。 株式会社HITOSUKEのシステム開発Unitでシステム開発を担当しているTです。 今回はTypeScriptで引数を取るか取らないかを任意で設定できる関数の作り方を紹介します。 この記事で紹介する内容はすでに中長期的にシステムを運用していて、ほかの機能への影響を最小限にすることが最大の利点だと考えています。 実装さっそくcodepenで実装とその結果をご覧ください。 今回の実装は、動作を分かりやすく理解してもらうためにシンプルな構造で作っています。 検索
こんにちは。 株式会社HITOSUKEのシステム開発Unitでシステム開発を担当しているTです。 今回はセレクトボックスで複数の選択肢を初期表示時に表示する方法をお伝えします。 この記事を読むことで、下記の添付gifのような実装をすることができます。 実装さっそくcodepenで実装とその結果をご覧ください。 今回の実装で重要になるのが、HTMLファイル2行目の記述です。 <select size="4"> selectタグのsizeオプションを使うことで、初期表示時
こんにちは。 株式会社HITOSUKEのシステム開発Unitでシステム開発を担当しているTです。 今回はフランチャイズに特化したサービスの開発について大変なことややりがいをお話していきたいと思います。 世の中には様々なサービスがあり、中には類似したサービスもたくさんあります。 しかしHITOSUKEではフランチャイズに特化したサービスの開発及び展開をしています。 HITOSUKEが開発しているサービスのイメージがつきにくかったり、そもそもフランチャイズとは何かを存じ上げない
RPAとは、Robotic Process Automationの頭文字をとった略語。 Excelのマクロよりもかゆいところに手が届く、システム開発よりも小規模で導入しやすい。と、大企業や中堅企業を中心にRPAの導入が進んでいます。 中小企業でも今後、ますますRPAの普及が進むことでしょう。 そんなRPAの中でも有名どころをご紹介します。 3大RPAツール WinActor WinActorは、日本生まれのRPA NTTグループで研究・利用を続け、技術とノウハウが詰ま
こんにちは。 株式会社HITOSUKEでシステムエンジニアをしているTです。 今回はAngularのngForで使用できる特殊変数を使って指定した要素の時に表示を変える実装を行います。 実装最初と最後の要素の表示を変える まず初めに特殊変数「first」と「last」を使用して、最初と最後の要素が表示されたときに、背景の色を変えて表示できるようにします。 画像の通り、最初の要素の背景を赤に変更し、最後の要素の背景を青に変更しました。 実際のソースコードはこのようになって
F-SUKE SalesAutomation はフランチャイズ本部が新規加盟店を 募集・管理・契約獲得するまでのプロセスを管理する業務に特化した MA型営業支援SFAのクラウドサービスになります。 現状は社内で本番テストを行い、問題なく活用出来るレベルまで機能をブラッシュアップさせて、F-SUKEの新シリーズとして市場にサービス展開を始します。 前回までは、F-SUKE SalesAutomationの概要と、なぜMA型SFA+CRMのSaaS型システムの導入が社内
F-SUKEの新サービスである SalesAutomation が完成しました。 F-SUKE SalesAutomation はフランチャイズ本部が新規加盟店を 募集・管理・契約獲得するまでのプロセスを管理する業務に特化した MA型営業支援SFAのクラウドサービスになります。 現状は社内で本番テストを行い、問題なく活用出来るレベルまで機能をブラッシュアップさせて、F-SUKEの新シリーズとして市場にサービス展開を始します。 前回は、F-SUKE SalesAut
F-SUKEの新サービスである SalesAutomation が完成しました。 現状は社内で本番テストを行い、問題なく活用出来るレベルまで機能をブラッシュアップさせて、F-SUKEの新シリーズとして市場にサービス展開を始します。 F-SUKEとは株式会社HITOSUKEが提供するITサービスの総称です。 現在、下記の通り2つのサービスがあります。 ・StoreOperation（店舗システム） F-SUKE Store Operation は、フランチャイズ加盟店側
HITOSUKEのシステム開発Unitでシステム開発を担当しているTです。 今回は、JavaScriptでソート機能の実装を行います。 一覧表示をする際に、データが増えるにつれて表示される順序の並び替えを行いたいユーザーは多くいると思います。 今回はJavaScriptのsortメソッドを使用してソート機能を実装していきましょう。 実装今回の記事では下記の機能・実装を解説していきます。 初期表示時はアルファベットが昇順（asc）に並んで表示されています。 画面上部のdes
HITOSUKEのシステム開発Unitでシステム開発を担当しているTです。 今回は、よく使用する入力の長いコマンドをまとめて一つのエイリアスとして設定する方法を紹介します。 エイリアスとはエイリアスとは、別称・別名のような意味を持っていいます。 今回設定するエイリアスも同じような意味合いで使用されています。 分かりやすい例でいうとファイル操作で使用するWindowsのショートカットやLinuxのシンボリックリンクなどが似たような機能をしています。 該当のファイルに容易にアク
HITOSUKEのシステム開発Unitでシステム開発を担当しているTです。 今回は、AndroidのChromeで開発者ツールを使用してコンソールを確認する方法を紹介していきたいと思います。 Webアプリケーションの作成するときに、PC上で開発者ツールを使用することは多いと思います。 そんな便利な開発者ツールをAndroidでも使用することが可能で、とても便利だったのでやり方を共有したいと思います。 Androidの準備まず初めに、Androidで開発者ツールを使用するた
HITOSUKEのシステム開発Unitでシステム開発を担当しているTです。 今回は、JavaScriptで文字と空白の文字列を空白で区切って配列に代入する方法を解説していきます。 複数検索条件を入力するときに、検索窓（input type="text"）が複数あるとレイアウトの調整が難しかったり、ユーザビリティが格段に下がります。 ブラウザで検索するような空白で文字を区切って入力できることが最適ですね。 今回は様々な想定を考慮して実装していきますので、参考にしていただければ幸
HITOSUKEのシステム開発Unitでシステム開発を担当しているTです。 今回は、Angularのイベント時に実行される関数の引数に複数型を指定する実装の解説をします。 具体的には、一つの引数に対してstring型かnumber型のどちらかが渡される場合があるときの実装を行います。 具体例を見て、any型を指定すれば良いと考えた人は要注意です。 それでは実際の実装から見てみましょう。 実装下記の実装では「number」ボタンをクリックしたら引数に1（数値）を渡し、「str
HITOSUKEのシステム開発Unitでシステム開発を担当しているTです。 今回は、一つのGmailアカウント・メールアドレスから複数のメールアドレスを作る方法を解説をしていきます。 システムを開発していく中で、様々な条件を付けたダミーアカウントの作成やメール送信のテストなど、多くの場面でメールアドレスを使用する場面があります。 そのたびにGmailやほかのドメインのメールアドレスを作成するのは手間のかかる作業ですね。 今回はそんな手間を省略できるGmailのエイリアス機能を
HITOSUKEのシステム開発Unitでシステム開発を担当しているTです。 今回は、HTMLテンプレート上でngIfディレクティブを使って要素の表示・非表示ができるアコーディオンの実装の解説をしていきます。 Angularを使っていれば、とても簡単にアコーディオンを実装することができるので、ぜひ参考にしてください。 ※どのような場面で活用できるかは記事の後半部分で解説します。 実装はじめに挙動をお見せします。 ※埋め込みの際の視認性を高めるため背景色を変更しています。 実
HITOSUKEのシステム開発Unitでシステム開発を担当しているTです。 今回は、HTMLテンプレート上でngForディレクティブとスライスパイプを使って指定した回数分だけ配列の要素を表示する方法を解説します。 実装はじめに実際の実装を提示します。 下記の実装は、配列の最初から3つ目の要素までを表示する実装です。 app.component.ts import { Component, OnInit } from '@angular/core';@Component(
