OctoberCMSのJavaScript APIを使用してAjaxコールを呼ぶ際、$.request()を使用するが、TypeScriptから呼ぶとエラーになる。型定義ファイルを入れて解決する話。 TL;TR 下記で説明した内容をnodeパッケージとして利用可能にしたので、下記だけで解決する。
![OctoberCMSのAjax用関数($.request)をTypeScriptから使う - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/6ad40cc1c096cf8fe186cadc0bb712c62916d8ca/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-9f5428127621718a910c8b63951390ad.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTkxNiZoPTMzNiZ0eHQ9T2N0b2JlckNNUyVFMyU4MSVBRUFqYXglRTclOTQlQTglRTklOTYlQTIlRTYlOTUlQjAlMjglMjQucmVxdWVzdCUyOSVFMyU4MiU5MlR5cGVTY3JpcHQlRTMlODElOEIlRTMlODIlODklRTQlQkQlQkYlRTMlODElODYmdHh0LWNvbG9yPSUyMzIxMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT01NiZ0eHQtY2xpcD1lbGxpcHNpcyZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZzPTE2YzZjMjk5ZjBhNmViMTExNmU0OGU4OWU5ZmY3ZTJj%26mark-x%3D142%26mark-y%3D112%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTYxNiZ0eHQ9JTQwcGlrYW5qaSZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTM2JnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnM9ZGFiNTY3Nzc0NTQyOWQxYjVjNjYwNWQxZjNjY2RkMDI%26blend-x%3D142%26blend-y%3D491%26blend-mode%3Dnormal%26s%3Da31bfe4ef091000b7ab5894b4fe118b7)
OctoberCMSのJavaScript APIを使用してAjaxコールを呼ぶ際、$.request()を使用するが、TypeScriptから呼ぶとエラーになる。型定義ファイルを入れて解決する話。 TL;TR 下記で説明した内容をnodeパッケージとして利用可能にしたので、下記だけで解決する。
next.jsをFirebase FunctionやGoogle Cloud Containerで動かす話はあったが、GAEの話があんまり無さそうだったのでざっくりメモる。 https://qiita.com/mizchi/items/60722563b8a938e7336f https://medium.com/google-cloud/next-js-tutorial-deploy-to-docker-on-google-cloud-container-engine-6b0c19dd8ecb GAEについて Google App Engine、ざっくり言うとHerokuっぽいもの。 GAEにはflexibleとstandardというのがあり、NodeのStandardが追加されたということ。 この部分に疎いので、どちらが良いのかわからないが、下記のデモなどでもStandardを利用して
Vue + TypeScript + Nuxtの書き方 概要 Vue使いたい!Nuxt使いたい!Vue3系からは、Typescriptを利用しているらしい! ということで、TypeScript使ったことないので、勉強がてらメモ & リンク集。 (TypeScript部分は動作確認を全てしているわけではないので注意!) TypeScriptとは? マイクロソフトが開発したaltJS(JavaScriptの代替言語、コンパイラーによって、JavaScriptに変換される) 特徴を簡単に言うと、静的な型システムとクラスベースが使えるJavaScript(ただ、クラスベースの開発は、ES2015でもできる) 基本 変数の定義時には、型を宣言する。 デフォルトでは、全ての型に対して、null / undefinedを代入可能。これは、tsconfig.jsonで代入不可能に変更可能。 let nam
気付いたらTS 3.1.1がしれっとリリースされていたので、今回導入されたMapped Tuple Typeについて書いてみようと思います。 対応するPRはこちら。 今回のMapped Tuple Typeは、TypeScript 2.1で導入されたMapped Typeの強化版です。 ちなみに「Mapped Type is 何」という人は、以前に解説記事を書いたのでこれを読むと良いかと。 さて、Mapped Tuple Type、別に新しい記法とかが追加されたわけではありません。 次のコードは上記のPRに記載されているサンプルです。 type Box<T> = { value: T }; type Boxified<T> = { [P in keyof T]: Box<T[P]> }; type T1 = Boxified<string[]>; // Box<string>[] type
React ComponentをGUI上のコンポーネント = Code Componetとして表示できるFramer X。 そのFramer XのCode Componetからローカルの(プロジェクトディレクトリに置いている)画像ファイルにどうアクセスするか公式のSlack#framer-xチャンネルで質問して教えてもらえたのでメモを残しておきます。 画像ファイルの置く場所 画像ファイルは以下ディレクトリに配置します。 + FramerXのプロジェクトディレクトリ + container + code - Hoge.tsx + design + assets - horse.png この design/assets 以下に置くと http://127.0.0.1:4567/design/asstes/image.png でアクセスできるようになります。 Code Componentからの参
エンジニアじゃないけどアプリが作りたかった こんにちは。まつもとかづまさと申します 僕はこの記事を書いている現在は障害者支援施設で支援員として働いています。 今回は3 step wallet という知的障がいの方でも「暗号通貨決済をできるようにする」という目的で作成したアプリの話です 3 step walletはこちら 今日の記事の流れ では本編へ PWAとVue.jsでNEMウォレットアプリを作ろう!TypeScript導入 〜 TypeScriptで書いてみる まず注意して欲しいのがライブラリのインストール先です。 実際に僕はこの時はターミナルを使っていたので少し違います。 この cd 3-step-wallet がとても重要になりました。 前回の記事で書いたことなのですがライブラリがファイルにインストールされていない状態になっていたので、 npm run dev ではうまくできていた
エンジニアじゃないけどアプリが作りたかった こんにちは。まつもとかづまさと申します 僕はこの記事を書いている現在は障害者支援施設で支援員として働いています。 今回は3 step wallet という知的障がいの方でも「暗号通貨決済をできるようにする」という目的で作成したアプリの話です 3 step walletはこちら 今日の記事の流れ vueのフォルダを作ってgithub pagesに公開できるようにいじる まずはアプリの基礎となる記事を参考にしました。 PWAとVue.jsでNEMウォレットアプリを作ろう!環境構築 〜 PWAアプリの起動 PWAとVue.jsでNEMウォレットアプリを作ろう!TypeScript導入 〜 TypeScriptで書いてみる PWAと Vue.jsでNEMウォレットアプリを作ろう!ウォレット作成 このアプリのベースはこの3つの記事が元になっています。 まず
はじめに 仕事でコミュニティが活発なライブラリを活用することが増えてきたのですが、日本語の記事がなかったり、英語の記事を見ながら試行錯誤したので、備忘も兼ねてまとめます。 同じ悩みを抱える人の救いになれば幸いです。 (間違いがあればご指摘ください) Formik Formik とは、Reactで使えるフォームの管理をしてくれるイケてるライブラリです。 同僚が使う理由として "its the lib recommended by the formskit team" を挙げていました。 ごめんなさい、ドヤ顔で言われてもそのすごさを理解できてないヘボヘボエンジニアです。 というか、Ant Design の Form Component であらかた入力フォームとバリデーション実装したタイミングだったので、「マジかよ…」と思いました。 yup は、Yup is a JavaScript objec
はじめに Alibaba の Ant Design が結構イケてます。 特に Upload Component がおしゃれな挙動をしてくれるんですが、デフォルトで POST で送信しちゃうようです。 PUT で送信する要件があったのでそのナレッジを書いておきます。 PUT を使った Upload いきなり本題です。 Class / Stateless Functional Component は省略します。 実装箇所がわかりやすいようにrender以降の部分を記載します。 (Stateless Functional Component の場合はreturn以降をご参考ください。) import { Upload, Icon } from 'antd'; /*** 中略 ***/ createButton = () => { return ( <div> <Icon type={'plus'
エンジニアじゃないけどアプリが作りたかった こんにちは。まつもとかづまさと申します 僕はこの記事を書いている現在は障害者支援施設で支援員として働いています。 今回は3 step wallet という知的障がいの方でも「暗号通貨決済をできるようにする」という目的で作成したアプリの話です 3 step walletはこちら 今日の記事の流れ コピペとライブラリをインストールする場所の危険性 この記事の話になります。 PWAとVue.jsでNEMウォレットアプリを作ろう!TypeScript導入 〜 TypeScriptで書いてみる まずはアプリの基礎となる記事を参考にしました。 PWAとVue.jsでNEMウォレットアプリを作ろう!環境構築 〜 PWAアプリの起動 PWAとVue.jsでNEMウォレットアプリを作ろう!TypeScript導入 〜 TypeScriptで書いてみる PWAと V
epicでintervalを利用するような場合、HMRが効いてるとそのまま動いてしまう。 storeはHMRで更新されるので影響は無いが、consoleなどで追っかけているとObserverが動いていてちょっと気持ち悪い 解決方法: Subjectを利用してmodule.hot.disposeで発火して止める import { combineEpics } from "redux-observable" import { interval, Subject } from "rxjs" import { map, takeUntil } from "rxjs/operators" const disposer = new Subject() export const timerEpic = () => { return interval(1000).pipe( takeUntil(dispo
やったこと Serverless Frameworkを使って CloudFunctionを動かしてみました。 試した内容は下記の通りです。 TypeScriptで書けるようにしてみる serverless.ymlの設定で環境変数を利用する 日本のリージョンにDeployする 実際に利用したコード https://github.com/selmertsx/study/tree/master/serverless/cloudfunction-sls-sample 前提 上記チュートリアルを実行して、nodejsのコードをdeploy & invokeできるようにしてある前提で話を進めます。 TypeScriptで書けるようにする https://github.com/prisma/serverless-plugin-typescript このpluginを利用します。 手順は簡単で、下記の手順
All slide content and descriptions are owned by their creators.
Angularとは? Wikipediaより。 AngularJS(アンギュラージェイエス)、または Angular は、Googleと個人や企業のコミュニティによって開発されている、完全にJavaScriptで書かれたオープンソースのフロントエンドWebアプリケーションフレームワークである。 (中略) AngularJSはシングルページアプリケーション (SPA) の開発が可能なフレームワークで、一つのフレームワーク内で全ての機能が完結するフルスタックフレームワークであることが特徴として挙げられる。 AngularJS - Wikipwdia 何ができるの? 主にSPAを作るためのフレームワーク。 Angular Materialといって、AngularでMaterial Designを簡単に導入できるツールなどもあり、いい感じの見た目のサイトが割合簡単に作ることもできる。 ただ、かなり
好きな構文はアノテーションです。 メソッドを装飾して、そのメソッドが何に使われるかを定義する文法が大好きです。 各言語のアノテーションの説明 アノテーションはいろいろな言語で実装されていますが、それぞれ呼び方が違います。(この表現方法が正しいかはわかりませんが) アノテーションはJavaの呼び方です。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く