Angularで遊んでみる:セットアップ
次の仕事でAngularを使いそうなので、遊んでみることにする。
参考にするサイトは公式チュートリアル
セットアップ~
Node.jsをインストール
推奨版を入れた。
Node.jsとnpmがインストールされてるか確認
$npm -v $node -v
入ってることが確認できた。
Angularをインストール
公式チュートリアルに戻り、npmを使ってAngularをインストール。
npm install -g @angular/cli
一瞬プロキシの壁に阻まれたが、インストールできた。
インストール出来てるか確認。
ng version
入ってることが確認できた。
初期アプリケーションを作成する
チュートリアルと同じく、my-appを作ることにした。
ng new my-app
ここもプロキシ注意
ディレクトリを移動して、my-appを起動する
cd my-app ng serve --open
ちょっと待ってると、勝手にブラウザが開いた。
ちなみに、作ったフォルダの中↓
セットアップできた!
SaturdayNightSpecial!!
Azure初心者が無料ではじめてみた。
Azureとはなんぞやを学ぶために、とりあえず無料アカウントで遊んでみることにした。
環境
Azure無料のやつ JDK11
ざっくり説明
コンストラクタ
コンストラクタは、ストレージの接続先をルートにするか
ルート配下のディレクトリにするか、どちらでも選択できるように2つ用意した。
今回はGitLabに上げることを考えて、接続情報をコンストラクタの第一引数にした。
普段はそんなことしなくていいと思う。
// 接続先:ルート public AzureStorageAccess(String storageConnectionString,final String shareName)
こいつがやることは第三引数まであるコンストラクタを呼び出すだけ。
※第三引数にはnullを格納する。
// 接続先:ルート配下のディレクトリ(ディレクトリ名は任意) public AzureStorageAccess(String storageConnectionString,final String shareName, final String dirName) {
第三引数がnullならルートを接続先として格納する。
そうでなければ第三引数の場所を接続先として格納する。
アップロード
アップロードも2種類用意した。
・ファイルパス(String型)を渡すメソッド
・ストリーム(FileInputStrem型)を渡すメソッド
public void upload(final String inputFilePath, final String outputFileName)
public void upload(final FileInputStream inputStream, final String outputFileName)
ダウンロード
ダウンロードしたいファイル名を引数に渡すとダウンロードしてくれるぞ。 戻り値voidにしてたの忘れてたわ
public void download(final String fileName)
ファイル一覧取得
とりあえず作るよね、ファイル一覧取得。 リストになって帰ってくる。
public List<String> list()
ファイルデリート
ファイル名に一致するファイルを削除する。 今のままだとコンストラクタで指定した接続先の配下にいないと削除してくれない。 うん、実際に使うには修正が必要だね。
public void delete(final String fileName)
今回はこんな感じ。以上。
GitLab
開発をするにあたり、環境を整えてみた。
開発するなら、まずは形から。
今回は環境を整えるという回である。
勉強も兼ねてAtlassianとAzureに触れてみようと思う。
Atlassian系 - Bitbucket - Jira - Confluence
Azure系・・・これから考える。 明日調べる。
Atlassian系は仕事で使ってるのでなんとなく分かるが、
Azureはこれから使う予定なので、事前に触ってみようかと…。
そのくらいのノリである。 ( 別件でNode-REDも触ってみたいんや。)
上に記載したAtlassianは一人で開発するには無料だし、かなり優秀だと思う。。
SpringBootを使ってTeamsにメッセージを投稿してみた。
はじめに
この記事は富士通システムズウェブテクノロジー Advent Calendarの17日目の記事です。
(お約束)本記事の掲載内容は私自身の見解であり、
所属する組織を代表するものではありません。
入社2年目がSpringBootを使ってTeamsにメッセージを投稿して遊んでみた記事です。
技術力はまだまだだけど、お祭りに参加したぞってのを感じて。
まぁ、少しくらいは知識を身に着けて。
楽しかったと言えればそれでいいのだ!くらいの気持ちで書きました。ええ。
ということで、遊んでいくゾ
Teamsとは
Microsoft社が開発したチーム間のコミュニケーションを促進するためのツール。
【コンセプト】
チャット機能、音声機能、会議等により、
チームのメンバーがどこにいてもコミュニケーションを取ることができる。
Teamsの主な機能
- チーム内でのオープンな会話
- チームメンバー同士のチャット(コミュニケーションスペース)
- チームのメンバーとの1:1でのチャット
- チーム内でのファイル共有
- 関連サービスまたはシステムとの連携(コネクタアプリ)
- チームの会議のスケジューリング
- 音声/ビデオ通話(Skype for Business機能を活用)
Teamsの構成
組織/チーム/チャネルの3つで構成されている。
組織 ┣ チーム① 1 ┃ ┣ チャネル1 ┃ ┣ : ┃ ┗ チャネルn ┣ : ┗ チームn ┣ チャネル1 ┣ : ┗ チャネルn
TeamsとSlackの違い
開発コンセプト
【Slack】
メールでのコミュニケーションを不要として
チャットツール中心のコミュニケーションを実現すること。
【Teams】
チャットとメールを別のコミュニケーションツールとして棲み分け、
双方を有効活用したコミュニケーションを実現すること。
遊ぶのだー!!
まずは、遊ぶための下準備。
遊ぶためには準備が必要。しっかりとやっていこう。
前提
- Teams
- JDK11
- SpringBoot
- Gradle
Teamsのアカウントを準備する
公式サイトからサインアップorサインインをする。
※既にOutlookのアカウントを持っている人はサインインでいいゾ。
アカウント作成途中で「会社名は?」とか聞かれたような気がしたが、
Sampleとしておいた。
Sampleの配下に「一般」というタブがある。
この「一般」こそがチャネルである。
コネクタを準備する
今回は外部からメッセージ投稿するので、Incoming Webhookを使っていく。
コネクタの設定方法
① 外部からメッセージ投稿させるチャネルを選択し、「コネクタ」を押下。
② コネクタが一覧で表示されるので、
「Incoming Webhook」を探してボタン「追加」を押下。
③ Incoming Webhookの詳細画面に遷移するのでもう一度ボタン「追加」を押下。
④ フック名に適当に名前を付ける。今回はsampleにした。
名前を付けたらボタン「作成」を押下。
⑤ スクロールするとURLがあるのでそれをコピー!メモか何かに貼り付けておこう。
念のためURLは隠したゾ。
さぁ、メッセージを投稿しようではないか!SpringBoooooooot!
Teamsの準備もできたところで遊んでいこう。ソースは下記参照。
言うても今回は、RestTemplateを使ってメッセージを送信するという簡単なもの。
定数URLの値は【コネクタの設定方法】の手順⑤のURLである。
SpringBootを起動して、ブラウザのURLに「http://localhost:8080/teams」を入れて…。
送信できたー!!!!
冒頭に書いた目標(楽しかったと言えればそれでいいのだ)は、達成と言ってもいいでしょう!
…といったところで今回はここまで!
今回使ったソース
@GetMapping(path = "/teams") public ResponseEntity<String> teams(){ HttpHeaders headers = new HttpHeaders(); headers.setContentType(MediaType.APPLICATION_JSON); Map<String, String> params = new HashMap<>(); params.put("title", "タイトル"); params.put("text", "テキスト"); HttpEntity<Map<String, String>> request = new HttpEntity<>(params, headers); RestTemplate restTemplate = new RestTemplate(); try { return restTemplate.exchange(URL, HttpMethod.POST, request, String.class); } catch (RestClientException e) { throw new RuntimeException(); } }
最後に
アドベントカレンダーというイベントに参加できたことを光栄に思います。
このような機会を作ってくださったjugemsanさん、ikedahideyaさん、相談に乗って頂いた皆様。
そしてなにより、こんな拙い記事を最後まで読んでくださった皆様、ありがとうございました。
参考URL
RestTemplateでつまったことが多いからまとめてみた
表題のとおりだが、RestTemplateでつまることが多かったため自分用にまとめてみた。
内容はシンプル。InvokerControllerがInvokeeControllerを呼び出すだけ。
PATCHメソッドはHttpComponentsClientHttpRequestFactory
を使用する。
サンプル
呼び出し元
@RestController public class InvokerController { private static final String URL_INVOKEE = "http://localhost:8080/invokee"; @GetMapping(path = "/get") public ResponseEntity<String> get() { RestTemplate template = new RestTemplate(); return template.getForEntity(URL_INVOKEE,String.class); } @GetMapping(path = "/post") public ResponseEntity<String> post() { SampleRequest request = new SampleRequest(); MultiValueMap<String, Object> bodyMap = new LinkedMultiValueMap<>(); request.setId("id"); bodyMap.add("id", request); HttpHeaders headers = new HttpHeaders(); headers.setContentType(MediaType.APPLICATION_JSON); HttpEntity<MultiValueMap<String, Object>> requestEntity = new HttpEntity<>(bodyMap, headers); RestTemplate template = new RestTemplate(); return template.exchange(URL_INVOKEE, HttpMethod.POST, requestEntity, String.class); } @GetMapping(path = "/patch") public ResponseEntity<String> test005() throws IOException { SampleRequest request = new SampleRequest(); MultiValueMap<String, Object> bodyMap = new LinkedMultiValueMap<>(); request.setId("id"); bodyMap.add("id", request); HttpHeaders headers = new HttpHeaders(); headers.setContentType(MediaType.APPLICATION_JSON); HttpEntity<MultiValueMap<String, Object>> requestEntity = new HttpEntity<>(bodyMap, headers); RestTemplate template = new RestTemplate(); // patchメソッド用。RestTemplateを書き換える。 HttpComponentsClientHttpRequestFactory requestFactory = new HttpComponentsClientHttpRequestFactory(); template.setRequestFactory(requestFactory); return template.exchange(URL_INVOKEE, HttpMethod.PATCH, requestEntity, String.class); } }
呼び出し先
@RestController public class InvokeeController { @GetMapping(path = "/invokee") public String get() { return "Getメソッド"; } @PostMapping(path = "/invokee") public String post(@ModelAttribute SampleRequest req) { return "Postメソッド"; } @PatchMapping(path = "/invokee") public String patch(@ModelAttribute SampleRequest req) { return "Patchメソッド"; } }
GitLab
バッジ申請の現状を考えてみた。
既存のバッジ申請が面倒なことは、先日の記事でなんとなくお分りいただけたかと。
少し整理をして絵にしてみました。
全て手作業です。
団ごとにバッジ数を数えて取り纏めて。
県連盟も、在庫管理は手作業です。
多少は手作業も必要でしょうが、そこまで手作業にする必要は無いと思います。。
少しずつ、進めていければと思います。