つくりおきスマートフォン用の表示で見るつくりおきスタートアップで働くWebエンジニアのブログこの広告は、90日以上更新していないブログに表示しています。11日目のエントリーです。くんで、なぜpthread_mutexは機能するのか?というエントリーでした。みんなkosen10sに全く関係無い記事を普通に書いているので自分も普通に今日勉強したことを書く。electronとかvueのアドベントカレンダー向けのエントリになっている。使ったよVue回りの解説はあんまりしないけど雰囲気で読み取れると思うElectron覚えるとWebのFrontend技術で簡単にデスクトップアプリが作れて雑用力が上がるのでおすすめElectronとはWebサイトを作成する感覚でデスクトップアプリを開発できます。いったWeb技術を利用してネイティブアプリケーションを作成するためのフレームワークです。開発者はアプリの重要な部分の実装に集中して、面倒な部分はElectronにお任せください。技術的にはchromiumを内包したアプリができます。中でNode.jsが動いています。Codeを始め、がんがん採用実績が増えているフレームワークです。devESLintのstandard設定を選択したので生成される.eslintrc.jsを変更しないかぎりはそれに従わないとエラーが発生する。ESLintに従ったコーディングをおすすめするが慣れない人は削った方がいい。起動するとこんなWelcome画面。Chromiumが動いていて、WebPackDevServerがサーバになっている。アクセスすると真っ白な画面になった。うまいこと隠してくれているみたい。見たところProdビルドではlocalhostURLではなくファイル参照になるようなので安心。最終的にできたものSlackを参考にしつつデザイン頑張ってみた。ctrl+83でctrl+sを使う。他にもっとうまいやりかたがありそう。長いので省略</style>自分的に学びのあった部分はコメントを入れた。<template>にHTMLを、<script>にJSを、<style>にCSSを書いていく。<script>でexportしているdataにリアクティブにするデータを、methodsにクリックイベント等で呼ぶ関数を書いていく。書くべき場所があるって素晴らしい。linux用のバイナリが出力されたインストーラは出来なかったのでそのうちまた調査するwindowsはエラーが出てビルド出来なかったがwindows用のビルドにはwineが必要らしい注意!!!ビルドは恐ろしくメモリを食い尽くすようでChromeが落ちる!ビルド前にはブログの途中書きとかがないか確認しよう!!!感想とかWeb技術でデスクトップアプリが作れるようになってしまったので雑用力が向上したこのメモ帳はCSSとかで行き詰まったところを除けば3,4時間で作れたので、簡単な社内で使うユーティリティツールなら1日かからず作れてしまいそう今回は状態の保存すらできず、Vuexを使わなかったがstoreにデータを入れて、それをJSONで保存して、起動時にロードすれば状態の保存がかなり楽になりそうなのでやりたいフロントエンド書いてるのにブラウザがChromium限定なので新しい記法や仕様を思う存分使えそう。ブラウザ別の対応を考えなくていいピュアelectronを触らずに最初からelectron-vueを使い初めてしまったのでelectronとelectron-vueの恩恵の境界がわかりづらくなってしまった少なくともelectron-vueを使うことで元からVue.jsを使っていたチームなら爆速でデスクトップアプリ対応出来そう明日の担当はtsudukamiで「教育のお話詰め合わせセット」です。»プロフィールid:daryoWebエンジニア。プログラミングや思ったことなどなんでも書きたい。最新記事slackにyoutubeのチャンネル登録者数やtwitterのフォロワー数を通知するChrome拡張とFirebaseで作るチャットアプリホバーしたエレメントにハイライトを当てるlernaを使ってnpmプロジェクトをモノレポ化するスタートアップに転職した月別アーカイブはてなブログをはじめよう!daryoさんは、はてなブログを使っています。ブログを報告するスターをつけました引用をストックしましたストック一覧を見る閉じる引用するにはまずログインしてくださいログイン閉じる引用をストックできませんでした。再度お試しください閉じる限定公開記事のため引用できません。