フリーランス 技術調査ブログ

フリーランス/エンジニア Ruby Python Nodejs Vuejs React Dockerなどの調査技術調査の備忘録

vuejs

Vueでタグを入力および削除できるコンポーネントを作成する

はじめに 下記のようなタグ入力フォームを作る コンポーネント作成 components/TagInput.vue ファイルを作成する <template> <div class="current-user-tag-wrapper"> <v-chip class="current-user-tag-chip"" v-for="(tag, index) in newTags" :key="index" close @click:close="removeTag(index)"> {{ tag }} </v-chip> </div></template>

Nuxtjs+ExpressでPDF作成及びダウンロード

はじめに Nuxtjs+Expressで構築したシステムでP DFの作成及びダウンロードする機能の実装をする必要があり、技術的に調査した結果を下記にまとめました。 NodejsでPDFを生成できるライブラリ NodejsでPDFを生成できるライブラリをいくつかピックアップして…

NativeScript-Vueで画面遷移する

はじめに 前回、ローカルストレージに保存する処理を調べたので、次の画面に保存したデータを表示する方法を調べる コード components/HelloWorld.vueファイルを下記のように記述する <template> <Page class="page"> <ActionBar title="Local Data Storage" class="action-bar" /> <ScrollView> <StackLayout class="home-panel form input-field"> </stacklayout></scrollview></actionbar></page></template>

NativeScript-Vueでローカルストレージを利用する

参考ページ docs.nativescript.org docs.nativescript.org コード <template> <Page class="page"> <ActionBar title="Local Data Storage" class="action-bar" /> <ScrollView> <StackLayout class="home-panel form input-field"> <Label text="数値" class="heading" /> </label></stacklayout></scrollview></actionbar></page></template>

vee-validateでレイアウトが崩れる時の対処

はじめに vee-validateで覚えたことを下記にまとめる <validation-provider>タグを利用するとレイアウトが崩れる現象に遭遇したので、その時のメモ。 レイアウトが崩れるコード <validation-provider>を埋め込むとdivタグが自動で生成されるため、レイアウトが崩れていた。 <validation-provider rules="required|nameKanji:@姓,@名" name="姓" > <div class="hogehoge"> <p class="inputform_input-title"> 姓 </p> </div></validation-provider></validation-provider></validation-provider>

NativeScriptのインストールとプロジェクトの作成

インストール nodejsが入っている状態で下記のコマンドを実行する $ npm install -g nativescript インストール時に下記の2つの質問を聞かれる。2つともNを指定する Do you want to help us improve NativeScript by automatically sending anonymous usag…

naitive scriptを触ってみる

はじめに native scriptというものを見つけたので、試しに触ってみる。しかもPlaygroundがあるのでブラウザで試すことができる。 play.nativescript.org Playgroundで実装したアプリは下記の2つをインストールして実機で検証することができました。 NativeS…

Vue3 + Typescriptでコンポーネントを作成する

はじめに TypescriptとVue3の環境を作成したので、Typescriptのclassを利用して簡単なコンポーネントを作成する [Vue v3] @ComponentデコレータとVue基本クラス @Component名前がに変更され@Optionsます。 @Options オプションを宣言しない場合はオプション…

docker環境でVeu3とTypeScriptの環境をHotReloadする設定とvue routerをインストールする

はじめに 前回、docker環境でVue3とTypeScriptを動作する環境を作ったので開発するためにhot reloadできるようにする px-wing.hatenablog.com vue.config.jsファイル watchOptionsでpollをtrueに設定すると修正した内容がすぐに反映される。 module.exports …

Laravel フロントエンド

はじめに 前回、laravel/uiをインストールすることができたので、実際にlaravel/uiを利用してみる $ composer require laravel/ui ログイン/ユーザー登録スカフォールドを生成 $ php artisan ui vue --auth $ npm install $ npm run watch laravel/uiのエラ…