microCMS + Gatsby + GitHub Actions + S3 でJamStackのチュートリアル | DevelopersIO
What is Jamstack? ここ数年でよく聞くようになったワード。 Jamstackとはウェブサイトを構築および運用するための、技術の組み合わせです。 JavaScript・API・事前にレンダリングされたMarkupの組み合わせでJamStackとのこと。 (以前はJAMStackといってたけど、最近はJamstackだったりする) Jamstackは、 「ウェブをより速く・より安全に・より簡単に拡張できるように設計されたアーキテクチャ」であり、 生産性を最大化するツールやフレームワーク、ライブラリやワークフローなどを 組み合わせて構築されるもの、とのことです。 ※jamstack.orgより 従来のCMSではアクセスがあったとき動的にページを生成しますが、 Jamstackではデプロイ以前に必要なページを生成します。 具体的には、下記。 Webサイトのフロントエンド全体(HTM
[React] よーし! いっちょReactやってみっか! #1 環境構築編 | DevelopersIO
はじめに CX事業本部の中安です。まいどです。 主にiOS担当のモバイルアプリエンジニアをやっている身として、Swiftの記事をよく書いているのですが、 「たまには他のこともやらないとなー」と思いまして、React.jsを始めてみることにしました。 この記事は、その奮闘記と思ってくださいませ。 Reactとは あらためて「Reactとは」というお話をすると、 React (リアクト) は、Facebookとコミュニティによって開発されているユーザインタフェース構築のためのJavaScriptライブラリである。React.jsまたはReactJSの名称でも知られている。 Reactはシングルページアプリケーションやモバイルアプリケーションの開発におけるベースとして使用することができる。複雑なReactアプリケーションでは通常、状態管理（英語版）・ルーティング・APIとの対話のための追加のライ
![[React] よーし! いっちょReactやってみっか! #1 環境構築編 | DevelopersIO](https://cdn-ak-scissors.b.st-hatena.com/image/square/406d924d7d4c6327201a8281e75820982243f551/height=288;version=1;width=512/https%3A%2F%2Fdevio2023-media.developers.io%2Fwp-content%2Fuploads%2F2019%2F01%2Freact.jpg)
GKEでプリエンプティブインスタンスを使いこなす - あかいものログ
GCPにあるプリエンプティブ インスタンスをGKEでうまいこと使えないか、試行錯誤した結果をまとめます。 プリエンプティブ インスタンスとは 一言で言ってしまえば、AWSにあるスポットインスタンスのGCP版です。 公式ドキュメントにはこのように書いてあります。 プリエンプティブ VM は、最長持続時間が 24 時間で、可用性が保証されない Google Compute Engine VM インスタンスです。プリエンプティブ VM は標準的な Compute Engine VM よりも低価格で、同じマシンタイプとオプションを使用できます。 ドキュメントに書かれているように低価格で使用できるのが最大のメリットです。 だいたい1/3ぐらいの価格で使用することができます。 しかし、様々な制限があります。 意識しておかなければならないこととして、次のようなことがあります。 いつ終了するかわからない
Visual Studio Code on Linux
Note VS Code ships monthly releases and supports auto-update when a new release is available. Install additional components Install Git, Node.js, TypeScript, language runtimes, and more. Install VS Code extensions from the Visual Studio Marketplace Customize VS Code with themes, formatters, language extensions and debuggers for your favorite languages, and more. Set up AI-assisted coding with GitH
Kubernetes(GKE)にお安く入門する - LiBz Tech Blog
目次 目次 はじめに 経緯 そもそもKubernetesとは なぜEKS(AWS)ではなくてGKE(GCP)なのか 無料のクラスタをつくる とりあえずk8sクラスタをつくってみる ノード(インスタンス)が1つだけのノードプールをつくる 3つのノードが登録されているノードプールを消す 作成したクラスタに接続 起動したクラスタのPodを確認してみる podとは？ kubectlコマンドでpodの状態を見てみる preemptibleインスタンスのnodeを立ててスペックを確保する preemptibleインスタンスとは？ ＼(^o^)／ここから有料です＼(^o^)／ preemptibleインスタンスが1つのnode-poolをつくってみる Datadogで監視してみる ReplicaSetとDaemonSet ReplicaSetとは... DaemonSetとは... Datadogをいれ
Gitlab Registryを使ってGitlab pagesでpipeline時間を短縮・節約する | SERVERSUS
Gitlab CI/CDのビルドが遅い理由これは単純で、レポジトリにpushされる度に、全てのスクリプトを実行しているからです。つまり、多くのケースでGitlab側の問題でなく、自分が書いた設定（.gitlab-ci.yml）が適切でないということがほとんどでしょう。 同じ静的サイト向けサービスでも、Netlifyはログを見る限りキャッシュできるところはNetlify側が勝手にキャッシュしてくれています。同じ感覚でGitlab pagesで静的サイトをホスティングしようとすると、Pipeline quota（Pipelineの割り当て/無料ユーザーは月間2,000分）をモリモリ使ってしまいます。 ちなみに、Gitlab pagesでもNetlifyと同じようにキャッシュを使うことができます。 Gitlab CI cache キャッシュを利用したビルド時間の短縮については、下記の記事をどうぞ
Kubernetesにおけるストレージ関連のメトリクス一覧 - Qiita
はじめに Kubernetesで、パフォーマンスやキャパシティの監視を行う際、Prometheusなどを使い各種メトリクスを収集しGrafanaなどでグラフ化している人も多いのではないでしょうか。 本ドキュメントでは、KuberntesにてPV(Persistent Volume)を利用する際、モニタリングにて利用できるストレージ関連のメトリクスを紹介します。 ※ Kubernetes 1.17.3, Node exporter 0.18.1時点のメトリクスになります。 PVのマウントと監視範囲 PVがどのようにマウントされているのかを一例を用いて説明します。 以下の図は、外部ストレージから提供されているiSCSI VolumeがPod内のコンテナのディレクトリにマウントされるまでの、各デバイスファイルとディレクトリのマウントについて示しています。 まず、外部ストレージにより提供されたVo
無料でIFTTTやZapierっぽく全自動連携できる「n8n」を自サーバー上に構築してみた
複数のウェブサービスを連携し、定型作業を自動化してくれるサービスはIFTTTやZapierが有名ですが、特定のサービス以外は使えなかったり、有料プランでしか使用できない機能があったりします。オープンソースで使える自動化サービス「n8n」は無料で利用でき、自社製ソフトのような他の自動化サービスでは未対応のサービスも自動化できるとのことなので、実際に使ってみました。 n8n.io - Workflow Automation https://n8n.io/ まずはn8nのホームページにアクセスします。 ホームページ下部へと進むとインストール方法が記載されていました。今回はWindows 10の機能の一つであるWSL上のUbuntuにn8nをインストールします。 n8nを動作させるにはNode.jsが必要なので、記事作成時点で最新の推奨バージョンのNode.jsをインストールしておきます。 Nod
【Kubernetes】1週間かかる処理を1.5時間で終わらせた【並列処理】 - ニートの言葉
こんにちはあんどう(@t_andou)です。 今回はKubernetesを使って並列処理させた記録です。 まだ「とりあえずそれっぽく動くまで試してみた」という段階で、kubernetesを理解できてはいないので自分用のメモを公開しているという認識でご覧ください。 間違っている部分や、よりスマートなやり方がありましたらご指摘いただけると幸いです。 この記事の概要 機械学習に使う特徴量の作成で1週間かかりそうな処理を10分くらいで終わらせられないかと考え、GKE(=GoogleのKubernetes環境)を使い試行錯誤した記録です。 今回は一部失敗して完了時間が1.5時間になったものの、設定を上手く出来れば15分程度で終わる見込みです。 対象読者 ・Kubernetesの概要は知っているくらいのレベルの人 ・KubernetesのJobを使った並列処理をしたい人 目次 この記事の概要 対象読者
AWS CDKでWeb3層アーキテクチャを作成してみた | DevelopersIO
はじめに おはようございます､加藤です｡これまで､エンジニアとしてのキャリアは全てインフラエンジニアでしたが､今月からプログラマーとしてのロールを希望してゼロから再スタートしております｡ 今回､AWS CDK(以降､CDK)を使って典型的なWeb3層アーキテクチャを構築してみたので､こだわったポイントや使う過程で理解した事をご紹介します｡ リポジトリはこちらです｡ kmd2kmd/aws-cdk-ec2_web3tier ある程度CDKを理解されている方を前提として書いております｡下記のブログを読む､Workshopを試した経験がある程度の理解が必要です｡ AWS CDK が GA! さっそく TypeScript でサーバーレスアプリケーションを構築するぜ【 Cloud Development Kit 】 ｜ DevelopersIO TypeScript Workshop :: AWS
個人で運用するKubernetesクラスタ - k0kubun's blog
Kubernetesの使用感に興味があってaws-workshop-for-kubernetesというのを先週やり、ちょうどEKSがGAになった直後だったのでEKSが試せたのだけど、まあ最初からマネージドだとあまり面白みがないし金もかかるので、個人のVPSで動かしてた奴を全部Kubernetes上で動かすようにしてみている。 まだ本番で運用した知見みたいなのが貯まってるわけではないのだが、公式のドキュメントを中心に読んでいても単に動かし始める段階で結構ハマって時間を消費したので、これから同じようなことをやろうとしている人向けに備忘録を兼ねて使用感や知見をまとめておくことにした。 Kubernetesは今でもalphaやbetaの機能が多く、今後この記事の内容も古くなることが予想されるので、なるべく公式のドキュメントへのリンクを置くのを意識して書いてある。 構成 現時点で、ConoHaで借り
elasticsearch on Kubernetes(Docker for Mac)
はじめに [ pires/kubernetes-elasticsearch-cluster - Github ] を参考にelasticsearchクラスタを立てます。 Kubernetesを使用して拡張性を高く(スケールしやすい等)、 冗長化とx-pack無しのBasic認証導入とデータの永続化までやります。 デフォルトの設定を加えるためGCPのelasticsearchイメージに設定ファイルやプラグインのインストールコマンド、環境変数を加えたものを使用します。 動作確認 Docker CE for Mac(Edge): Version 18.02.0 Kubectl: Version 1.8 elasticsearch: Version 5.6 現時点(2018年2月)ではkubernetesを使うためDocker for Mac edge版を使います。 インストールしていない場合はD
npm とか bower とか一体何なんだよ！Javascript 界隈の文脈を理解しよう - Qiita
背景 Javascript で Web アプリを作ろうとすると、よくわからないことだらけで超混乱します。 npm と bower の違いは？ npm はサーバーサイド用、bower はクライアントサイド用らしいよ えっ、でもなんで bower のインストールに npm が必要なの？ サーバーサイドは Rails で書きたいから npm 要らないと思うんだけど・・・ ていうかサーバーサイドJSとか node.js って何？ よく見る browserify って何？ こういった疑問が沸き上がるのは、各ツールが生まれた文脈がよくわかっていないからです。いろいろ調べてやっとちょっとわかってきたのでメモします。間違いがあったらご指摘ください。 「CommonJS」誕生 - Javascript は汎用プログラミング言語へ その昔、Javascript 大好きおじさんは言いました。 Javascrip
nodebrew で Mac の Node.js 環境をスッキリさせた - akiyoko blog
1. はじめに Mac では、Node.js (node) は、Homebrew でインストールするのが一番手っ取り早いようなのですが、私の場合は Titanium Studio をアップデートしたときにインストールされたらしく、当然ながら特定バージョンの切り替えもできず、実行時に Permission Error が頻発したりして、苦労が絶えませんでした。 そこで今回、自身の Mac の Node.js 環境を全面的に見直してみたので、その履歴を残しておこうと思います。 なお、Grunt を使っていると、Node.js のバージョンによってビルドが失敗するということもあったので、Node.js のバージョン切り替えができるように、nodebrew で管理することにしました。 参考 2. 環境 Mac の OSバージョンは、 OSX 10.9.5作業開始前の各種バージョンは、 $ node
良く使うnpmパッケージの紹介 - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 自分が良く使う npm パッケージを、雑に紹介し感想を述べる記事です 非 Noder さん用にもなるように、超有名ライブラリも載せました 個人的感想の羅列で、また 1年以上使ってない/調べてないものも含みます。申し訳ないのですが、参考程度でよろしくです Web アプリケーション作成 express 一番有名でたぶん利用者も多い、Node.js の Webアプリケーションフレームワーク function (req, res, next) { return next(); } のような middleware という概念のフィルターを重ねて処
タスク自動化ツール「gulp」 を使って制作時間を短縮しよう
2014年12月24日 Webサイト制作, 便利ツール みなさん、タスクランナーを使っていますか？タスクランナーとはファイルの圧縮やSassのコンパイルなんかを、ファイルを保存したと同時に自動で行なってくれる素敵ツールです。制作のスピードアップも間違いなし！今回はそんなタスク自動化ツールのひとつ、gulpを紹介します。 ↑私が10年以上利用している会計ソフト！ gulpとは gulpとは、Node.jsを使ったタスク自動化ツールです。CSSやJavaScriptファイルの圧縮や結合、Sassのコンパイルなんかも自動化できるので、「フロントエンドしかいじらないよ！」というWebデザイナーさんでも、使えるようになると作業がかなりはかどりますよ。一度gulpでプロジェクトファイルを作成しておくと、自動化の手順を他の人と共有できるので、チームで開発する時にも力を発揮してくれます！ Gruntとの違
【Mac OS X 10.10】Haskell + Yesod + Heroku で webアプリ 1/3 - Qiita
14/12/02 現在最新の情報です. そろそろHaskellでwebアプリの一本でも作りたくなる季節ですよね. （画像はYesodでwebアプリのひな形を作った時に出てくる謎のアスキアート、Haskell界隈にはこいう不可解なものが多くてステキ） Haskell + Yesod + Heroku でwebアプリを作る事を「HYH」と言うらしいですよ（適当） 今回は環境構築編です. 次はアプリケーション構築法、最後にデプロイ法を書きます. GHC GHC ... Haskellのコンパイラで一番有名でYesodが唯一サポートしている. 今なら（いつでも）もれなくインタプリタをついてくる hsenv などもあるにはありますが、作者がさぼっていますしおすすめは出来ません. 後述するStackage + cabal sandbox + cabal freeze がベストプラクティスだと思います.
あなたのWeb開発人生を変えるYeoman、Bower、Yoのインストールと使い方
連載目次 前回記事「Gruntで独自タスクを定義し、独自プラグインをnpmモジュールとして作成・公開するには」では、Gruntを使っていろいろな手法でタスクを定義する手法や、独自プラグインを作成してnpmで公開する方法について解説しました。 今回は少し角度を変えて、Gruntを自身の機能として利用しており、快適な開発ワークフローを提供してくれるツール、「Yeoman」について解説します。 3つのツールを統合したワークフローを提供する「Yeoman」 Yeomanとは、公式サイトいわく、「The web's scaffolding tool for modern webapps」とのことです。 訳すと、「今風のWebアプリのための土台／基盤を作ってくれるツール」といったところでしょうか。「scaffolding」はRuby on Railsの主要機能として有名になった言葉で、コマンドを打つだ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
2019 年版：Electron の環境構築（Windows 向け） - Toragramming
blog.yucchiy.com is Expired or Suspended.