イラストレーターの妻が「ポートフォリオサイト欲しい」と言い始めたので、面白そうだと思い開発を開始しました。 静的サイトなら Jamstack ってのがイイらしいと最近よく聞くものの、何かはわからないので勉強してみて、巷の Jamstack 構築環境をできる限り自分の家の中に作ってみます。 結論から言うと適材適所なのですが、皆さんもコーポレートサイトやブログなど「これって Jamstack がハマるんじゃないかな」と思える箇所があると思います。 是非、検討する材料としてこの記事をご覧ください。 Netlify 社が定義した JavaScript + API + Markup (JAM) の構成を Jamstack と呼ぶようです。 まずは Jamstack の何が嬉しいか、見ていきましょう。 従来の Web サイト 従来の構成でサーバサイドがレンダリングした Web サイトを表示するまでの
Docker創始者らが開発、ビルド/テスト/デプロイの自動化をポータブルにするツール「Dagger」登場。そのままローカルでもGitHubでもCircleCIでも実行可能に Dockerの創始者であるSolomon Hykes氏らが中心となって開発しているオープンソースのCI/CD環境構築ツール「Dagger」が公開されました。 Windows、Mac、Linuxで試すことができます。 And we are live! Introducing Dagger, a new way to build CI/CD pipelines. By the creators of Docker. https://t.co/DU8racmoUo — dagger (@dagger_io) March 30, 2022 Daggerが定義したCI/CDパイプラインはポータブルになる Daggerとは「A P
歩数で草を生やしてみたのだー。これで散歩の楽しみが増えたなー やってること やってることはシンプルで、こう↓ Fitbit の API で歩数を取得 Pixela に記録 というスクリプトをつくって CircleCI で定期的に実行 Fitbit? 最近 Fitbit Sense というスマートウォッチをつけて散歩してる www.fitbit.com 会社の福利厚生で健康のための補助があるので、それを利用して手に入れたのだ。散歩やジョギングをしたら勝手に記録されてるので便利。睡眠のログも取られてるので面白い Pixela? Pixela は日々の活動を記録して見えるようにしてくれる API サービス。いちばん最初に貼った画像みたいに GitHub の草を生やすやつみたいにしてくれる。操作が全部 API 経由なのも楽しい pixe.la せっかく散歩してるから せっかく散歩してるから Fit
bash のシェルスクリプトを書くときに、いつも脳死で以下をやっている。(同僚が整備してくれたものをコピペしている) エディタなり CI で shellcheck をまわす set -euxo pipefail と冒頭に書く こんな感じ #!/bin/bash set -euxo pipefail いつまでもコピペではさすがにアレなので、意味を調べたメモ。 shellcheck koalaman/shellcheck: ShellCheck, a static analysis tool for shell scripts イケてない書き方に警告を出してくれる それぞれの警告にはエラーコード割り振られていてとても便利 エラーコードごとに正誤例、解説が書かれているのでわかりやすい SC1000 の例 CI もそうだし、エディタのプラグインも充実 しているのでとりあえず入れておくと良い set
見積OKの連絡とお願いを伝える 見積に対する僕からの返事は↓のような感じ。 (見積はOKです。金型を作る前の設計図データをチェックできますか?あと最初はサンプルとして30個だけ注文できますか) 金型の作成前に設計図データ(CADデータ)をチェックしたいということと、最初は少ないロットで注文したいとお願いする。 引き受けてもらえたのはありがたいが、正直なところ、ちゃんとしたものを作ってもらえるか心配だ。似たような事をしている人がいるか検索してみたが全く出てこなかった。中でも金型は一度作ってしまうと作り直しが利かないので、あらかじめ見せてもらう事にした。 この時にすっかり忘れていたが、最小発注個数(MOQ)もこの時点で確認しておくべきだった。 担当のウーさんも「最初は少ないロットで」と言う僕の要望に、「そうした方が良いです」と言ってくれた。 とても丁寧な対応 (添付のサイズはいくつですか、確認
AWSとCircleCIの力を借りて、Nuxt.jsで作った静的サイトの運用をできるかぎり自動化した話です。 3ヶ月ほど前からCIのサービスを使うようになり、入門記事はたくさんあって助かったのですが、具体的にどんな感じで使っているかの情報が少なかったので記事にしました。 もしかしたら、CIの使い方が間違っているかもしれないので、そのときは優しくコメントをいただけたら嬉しいです。 できあがった流れ 毎朝10時にLambdaを起こしてデータの更新を行い、静的ファイルを再生成してからデプロイする流れになっています。 対象のサイト ざっくりAWSという、AWSの料金を日本円でざっくり計算できるサイトです。 Nuxt.jsで作成したものを、静的サイトとして生成して、AWSのS3にホスティングしています。 計算に必要なAWSの価格や為替は、毎朝10時に取得したものをS3にJSONで保存し、そのJSON
GDG神戸 Flutter勉強会(9/29)での登壇資料です https://gdgkobe.doorkeeper.jp/events/78737 ## キーワード - クリーンアーキテクチャ - 設定の開発と本番の切り替え - CI/CD ## ソースコード https://github.com/kwmt/flutter-inconne ## 参考 - Clean architecture https://8thlight.com/blog/uncle-bob/2012/08/13/the-clean-architecture.html - DIについてわかりやすいと思う記事 https://blog.ishkawa.org/2017/09/18/1505701774/ - flavorについて https://medium.com/@salvatoregiordanoo/flavori
趣味チーム? 趣味チームに所属している方はいらっしゃるでしょうか。 お仕事関係なしに友人たちと趣味で開発するような人たちです。 趣味と言えどもチームですから、チームで使える開発環境を整えたくなります。 「 趣味チームの開発環境を整えたい 」 そう思った時に課題になるのが お金 です。 もちろん投資だと思ってお金を出せればいいのですが、基本線は趣味ですから中々そうもいきません。 ここはひとつ趣味の一環として、 無料縛り という制約を貸した上で、趣味チームの開発環境をどこまで整えられるのかを考えてみたいと思います。 環境イメージ 先にネタばらしをしておくと、以下のような感じに落ち着きました。利用量の制限はありますが 無料 です。 簡単に言うと以下のようなことができます。 メンバ数 制限なし プライベートリポジトリ 作成可 任意のデバイスからのチャット(~1万メッセージ)、ファイル共有(~15G
休日個人開発で学ぶテストコード! 画像に“集中線”を合成するツールを作ってみよう プライベートでも何か作りたい! そんなときの「今日からはじめる休日個人開発」シリーズ、第二弾はテストコードを書きながら簡単なMVCモデルの画像加工ツールを作ってみましょう。好きな写真に集中線を合成できます。 皆さん、プライベートで何か開発していますか? 「何か作りたい」という気持ちはあるものの、いまひとつ何から始めたらいいのか分からず、動けないままの人も多いと思います。 そんな皆さんのために、「仕事以外にも休日に個人で気軽に何かを作ってみよう!」という企画の第二弾です。今回は、第一弾で用意した開発環境を使って、画像を加工するツールを実際に作っていきます。 せっかくですので、ただ作るだけではなく、テストコードも一緒に書いてみましょう。最近は、CI(継続的インテグレーション)やCD(継続的デリバリー)も一般的にな
Google apps script のオリジナル・オンライン開発環境は、小さなプログラムをちゃちゃっと書いては捨てて動かすのにはとても便利ですが、ある程度大きなソフトウェアを開発・運用するとなるとそのままでは難しくなります。 特に Google apps(今は G-Suite ですね)を利用した業務システムの開発・運用をしている人は、業務システムは継続改善がつきものですし、苦労されているのではないかなあ・・・と思います(私もです!)。 そこで本稿では、Google apps scriptアプリケーションを Node.js のように複数モジュールで構成し、テストし、構成管理しながら開発する一連の手法を紹介します。 このフローを支えるツールもいくつか公開済みなのですが、実際にはまだ完全でない部分もあります。そういう意味では本来この記事はまだ早いのかもしれません。ただ業務の片手間でやっていてち
--headless時代の本命? Chrome を Node.jsから操作するライブラリ puppeteer についてJavaScriptChromee2e puppeteer はHeadless Chrome をNode.jsで操作しやすくしたライブラリです。今日(※ 2017/8/17)一日で凄い勢いでGitHubのトレンド入りしており、TLでも話題になっていたので、早速触ってみました。 Node.jsでChromeを操作するというコンテキストにおいては、Nightmare.jsと同じレイヤに属するプロダクトですね。Nightmare.jsはElectronを介在させることで、Chromeの操作を実現していましたが、今年の5月にChromeでheadlessモードが利用可能になって以降1、headless Chromeを直接操作するライブラリが色々と出始めていますね。この系統は、chr
React Native+Expoではじめるスマホアプリ開発 ~JavaScriptによるアプリ構築の実際~ 作者: 松澤太郎出版社/メーカー: マイナビ出版発売日: 2018/08/29メディア: 単行本(ソフトカバー)この商品を含むブログを見る ここ2週間ちょっとReact NativeでiOSアプリ書いてました。 サーバサイドをメインでやってきた自分にとって面白い技術で、今後も趣味で使ってみたいなと思えているのでTipsや所感を残しておきます。 目次 選定理由 Tips エラーハンドリング・状態管理 入力欄をキーボードの出現に合わせて動かすアニメーション 今回使ったライブラリ react-native-focus-scroll react-navigation react-native-vector-icons react-native-camera react-native-vid
簡単! JavaScriptで自動UIテスト (NodeJS, Selenium Webdriver, WebdriverIO, mocha, gulp)JavaScriptNode.jsSeleniummochagulp はじめに Webアプリ開発において、UIのテストは手動になりがちで、 専門のQAチームがいないと、なおざりになるケースが多いかと思います。 本記事では、オープンソースウェアのSelenium Webdriverを主軸に 現時点で筆者が最善だと思う 「JavaScriptで自動UIテストを行う」 方法をご紹介します。(ES6準拠) ポイント ワンライナーで実行可能にする (CI向き) テスト修正が容易 (保守性 高) Windows/Mac環境に依存しない (チーム開発向き) 環境 Windows 10 (Version 1607) / macOS Sierra 10.1
この一か月分の学習成果を整理したリポジトリを作ったので、その成果についてまとめておく。 作ったサンプルプロジェクトだけを手軽に欲しければ、このリポジトリを clone してほしい。 taichi/js-boilerplatemaster ブランチには、ミニマムな JavaScript 開発環境がサンプルコード付きで入っているfrontend ブランチには、React/Redux/webpackなウェブアプリケーション用の開発環境が入っているデフォルトブランチにしてある electron ブランチには、frontend ブランチの内容に加えてElectronでアプリケーションを開発するための環境が入っているはじめに#最近の JavaScript について#僕は仕事として JavaScript を書いている訳ではないけども、この半年くらいの間にちょっとしたツールならいくつか作った。どちらも便利
こんにちは.cordovaデビューした maxmellon です 今回は,cordova で作られたアプリケーションを CircleCI 上 でe2eテストする方法について触れたいと思います はじめに この記事の関連ワード 継続的インテグレーション, CIとは : 継続的インテグレーションとは|CI|Continuous Integration - 意味/定義 : IT用語辞典 CircleCI とは : CIサービスの一種,Githubと連携し push されたことを検出しテストを走らせるものがほとんど.ほかにも travisCI などが挙がる cordova とは : HTML5ハイブリッドアプリ開発を支えるOSS「Cordova」はなぜアツいのか?PhoneGapとの違いは何か? - ふろしき.js e2eテスト とは : システム全体が正しく動作することを確認するためのテスト.(e
CircleCI上で、BrowserStackを利用したマルチブラウザJavascript Test,Selenium Test を実現している方法についてご紹介します。Selenium webdriver, CircleCI, BrowserStack
Spectron(スペクトロン)はElectronの為のテストフレームワークで、ElectronのAPIを使用したテストが可能になります。テストを取り入れることで、「想定していた動作と違う」「作成していた機能がいつの間にか動作しない」といったことを未然に防げます。 Spectronからは実際にElectronアプリを起動することができ、「ウィンドウのタイトル」「デベロッパーツールの表示状態」といったことをElectronのAPIにアクセスして取得できます。また、「ページの画像キャプチャー」機能でデザイン崩れが発生していないかのチェックや「ページのテキスト保存」でテストに失敗した時のHTMLテキストの取得、「console.log()で書きだした内容の取得」も可能です。これらのテストは手元の開発機だけでなくJenkinsなどCI(継続的インテグレーション)サービス上でも使用できます。 ▲ 本
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く