[JavaScript][Node.js]フロントエンドとバックエンドの処理を共通化する - Qiita
Overview フロントエンドはReact、バックエンドはNode.jsで作っていると、どちらでも利用したい処理が出てきます。 両方とも同一言語なので、バックエンドをNode.jsにしたメリットを享受できます …そう思っていたのですが、write at onceかと思いきやモジュールの入出力の違いでそのまま共有することができません。 最終的にはGitHubを介して共有することになりましたが、結果に至るまでの過程を残しておこうと思います。 Target reader JavaScriptとNode.jsを扱っている方。 Prerequisite バックエンドはGoogle Cloud Function(以降、GCF)を利用する、つまりNodeの起動オプションを指定するようなことはできない。 Node.jsのバージョンはGoogle Cloud Function(GCF)に依存し、現時点では
![[JavaScript][Node.js]フロントエンドとバックエンドの処理を共通化する - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/b2695ba25acfc4d46f51903d8432319ea57ba5c0/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fqiita-user-contents.imgix.net%252Fhttps%25253A%25252F%25252Fcdn.qiita.com%25252Fassets%25252Fpublic%25252Farticle-ogp-background-afbab5eb44e0b055cce1258705637a91.png%253Fixlib%253Drb-4.0.0%2526w%253D1200%2526blend64%253DaHR0cHM6Ly9xaWl0YS11c2VyLXByb2ZpbGUtaW1hZ2VzLmltZ2l4Lm5ldC9odHRwcyUzQSUyRiUyRmF2YXRhcnMzLmdpdGh1YnVzZXJjb250ZW50LmNvbSUyRnUlMkY0NDU2MjE2MSUzRnYlM0Q0P2l4bGliPXJiLTQuMC4wJmFyPTElM0ExJmZpdD1jcm9wJm1hc2s9ZWxsaXBzZSZiZz1GRkZGRkYmZm09cG5nMzImcz1mOTMzYmZjODYxNjNmZDU0NzAzYzRiNzNkNjJlNzc4YQ%2526blend-x%253D120%2526blend-y%253D467%2526blend-w%253D82%2526blend-h%253D82%2526blend-mode%253Dnormal%2526s%253D5b26e7e550187cd19f3900ad09e6fadc%3Fixlib%3Drb-4.0.0%26w%3D1200%26fm%3Djpg%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk2MCZoPTMyNCZ0eHQ9JTVCSmF2YVNjcmlwdCU1RCU1Qk5vZGUuanMlNUQlRTMlODMlOTUlRTMlODMlQUQlRTMlODMlQjMlRTMlODMlODglRTMlODIlQTglRTMlODMlQjMlRTMlODMlODklRTMlODElQTglRTMlODMlOTAlRTMlODMlODMlRTMlODIlQUYlRTMlODIlQTglRTMlODMlQjMlRTMlODMlODklRTMlODElQUUlRTUlODclQTYlRTclOTAlODYlRTMlODIlOTIlRTUlODUlQjElRTklODAlOUElRTUlOEMlOTYlRTMlODElOTklRTMlODIlOEImdHh0LWFsaWduPWxlZnQlMkN0b3AmdHh0LWNvbG9yPSUyMzFFMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT01NiZ0eHQtcGFkPTAmcz1iZTU3ZTE5OTczNmRjNGM2YWZjNjgzY2U2NTBkMDcxNA%26mark-x%3D120%26mark-y%3D112%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTgzOCZoPTU4JnR4dD0lNDBxcnVzYWRvcnomdHh0LWNvbG9yPSUyMzFFMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT0zNiZ0eHQtcGFkPTAmcz02NGNkNDUwMDJhYmIyYWNjMWViOTA2OGNkNDZiM2EyNQ%26blend-x%3D242%26blend-y%3D480%26blend-w%3D838%26blend-h%3D46%26blend-fit%3Dcrop%26blend-crop%3Dleft%252Cbottom%26blend-mode%3Dnormal%26s%3D8078851ad29d43fdbf80b1c8b8ebef17)
フロントエンドの情報収集について - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 2020/07/17: いくつか追記しました はじめに 私は、TechTrainでフロントエンドのメンターとして面談する中で「最近フロントエンドの勉強を始めました！」という方や、フロントエンドエンジニアを目指す学生と話す機会が何度もあります。 その中でよくある質問が 「フロントエンドの情報収集ってどうしてますか？」 です。 何度も質問を貰うので、気になる人は多いのかなと思います。 この記事では「私がどんな風に情報収集しているか」を紹介しようと思います。主に情報収集の流れと、どこからフロントエンドの情報を集めているかについてです。 情報収
GitHub Actions の JavaScript Action を TypeScript で書いた - はやくプログラムになりたい
GitHub Action を TypeScript で作成したので，覚え書きがてらどうやって作ったかについて書きます． github-action-benchmark という Action をつくりました． 紹介記事：継続的にベンチマークを取るための GitHub Action をつくった Action とは 今年9月に GitHub Action v2 がリリースされました．GitHub Action は GitHub が提供する CI/CD サービスです． 既存のサービスと大きく違う点は，処理を汎用的に Action として切り出して再利用できることです． 例えば，GitHub からのリポジトリのクローン actions/fetch や Node.js のセットアップ actions/setup-node などの基本的な実行ステップも Action として実装されています． Acti
ServiceWorkerで画像を縮小してアップロード - Qiita
Service workerとは？ Service workerについては以下などを参考にしてください． Service Worker の紹介 概要 つくったもの Service workerを使って画像を縮小してからアップロードするサンプルプログラムを作ってみました． Webのファイルフォームから画像をアップロードする際に，Service workerが仲介して縮小処理をしてからアップロードを行います． Service worker上で縮小処理を行うメリットはこれだけでは未知数ですが何かの参考になれば幸いです． ソースコード 作ったソースコードはGithubにアップロード済みです．動かし方についてはGithubリポジトリのREADME.mdを参考にしてくださいませ． https://github.com/hiroyky/service_worker_image_uploader 個人的な
Vue.jsでHPを作成する - 開発環境を整える - Qiita
はじめに 転職活動用のポートフォリオを作るにあたりインデックス的なHPを作成することにしました。 なお、筆者は文系出身。SIerにてJava、PHPの業務経験がありますがプライベートでのアウトプットは行ったことがないです。 なお、どこでどう躓いたかどう対策したかを記録する目的もあり、手戻りである部分を残しております。 手戻りがない形で最初からきれいに作れる手順は「参考」に書かれているサイトなどで確認できますので、特別な理由がなければそちらを参照されることをお勧めします。 また、ここではVue、Git、GitHub、GitHubPages、VisualStudioCodeを使った「開発環境の構築」や「開発方針・開発手法の確立」までをまとめております。 具体的なHP作成の過程は別にまとめようと思います。 HP作成に当たる過程 READMEの検討 最初はHP作成は考えておらず、GitHubのRE
Nuxt.js＋Github＋Netlifyを使ったWebサイト環境構築手順 - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? Nuxt.js (Vue.js) + Github + Netlifyを使ったWeb開発環境構築手順を紹介します。 入門編の記事になりますので、Web開発をこれから勉強しようと思っている方にご活用いただければと思います。 この記事で触れること Web開発の用語集 Web開発環境の構築 Github＋Netliftyを使ったWebサイト公開（無料） Web開発の用語集 Git プログラムファイルを管理するための管理システムです。 最近では必須といっても良いくらいとても便利なので、時間のある時に記事を読んだり使ったりして理解しておきましょう
Vue.jsでアホなジェネレーターを作る勉強会をやると予想以上にガチになる
デイリーポータルZが「Vue.js勉強会」というWeb開発系のイベントを開催した。サイトを知っている人なら「え？あのデイリーが？なんでそんな真面目なイベントを？」と驚くかもしれない。 急に真面目なことをやりだすと、ヤンキー母校に帰る的な心変わりでもあったのかと心配になる。 僕自身がWeb開発の仕事をしているため「ふざけたサイトがやる勉強会なんて…」と最初は不安に思っていた。しかし、蓋を開けてみればエンジニア業務を擬似体験できるくらい内容のしっかりした勉強会だった。 大学中退→ニート→ママチャリ日本一周→webプログラマという経歴で、趣味でブログをやっていたら「おもしろ記事大賞」で賞をいただき、デイリーポータルZで記事を書かせてもらえるようになりました。嫌いな食べ物はプラスチック。（動画インタビュー） 前の記事：ドラクエに出てくる「やくそう」は現実だとどう使うのか専門家に聞く ＞ 個人サイト
GitHub - cube-js/cube: 📊 Cube Core is open-source semantic layer and LookML alternative for AI, BI and embedded analytics
Website • Getting Started • Docs • Examples • Blog • Slack • X Cube Core is an open-source semantic layer and LookML alternative. It can be used by data professionals to access data from modern data stores, organize it into consistent definitions, and deliver it to every application. Cube Core is headless and comes with multiple APIs for embedded analytics and BI: REST, GraphQL and SQL. If you are
yarn から npm に出戻ろうとしている話 - freee Developers Hub
こんにちは, 今年の freee の新卒エンジニアで会計freee の開発をしているけむりだま (@_kemuridama) です. この記事は freee Developers Advent Calendar 2018 の 11 日目の記事になります 🎄 今回は freee の中で最も大きなプロダクトである会計freee で使っている JavaScript パッケージマネージャを yarn から npm に出戻ろうとしている話をしていこうと思います. なぜやるのか 🤔 yarn から npm に戻ろうとしている理由は, 下記のブログで説明されている通り, npm がアップデートしていくのに従って yarn と性能が変わらなくなってきたためです. engineering.mixmax.com まず, yarn は並列インストールができるため npm よりパッケージインストールが高速でし
世界最大のソフトウェア開発プラットフォームで最も人気なプログラミング言語は何なのか？
by Alper Çuğun コンピュータープログラムを記述するために使用されるプログラミング言語には非常にさまざまな種類があり、それぞれに特色や長所・短所を持っています。そんなプログラミング言語と密接に関わっているソフトウェア開発プラットフォームのGitHubが、「2018年で最も人気のあったプログラミング言語」についてまとめています。 The State of the Octoverse: top programming languages of 2018 | The GitHub Blog https://blog.github.com/2018-11-15-state-of-the-octoverse-top-programming-languages/ ソースコードを共有するGitHubにとってプログラミング言語はサービスの中核を担うものであり、「いったいどのプログラミング言語が
半年間、自分を騙しながらアウトプットに積極的になってみた - valid,invalid
この半年間はソフトウェアエンジニアとしてのアウトプットに積極的になるよう意識的に行動してみたので振り返ってみます。長くなってしまったので3行でまとめるとこんな感じです。 成長と刺激を求めて OSS contribution や登壇やイベント運営を頑張ってみた 成長したかはわからないが、知り合いが増えたりして刺激を受けることが多くなった これからも続けていくが持続可能なペースにしたい この半年間、登壇とかイベント運営とかに積極的になるよう"試験運用-セルフコントロール-"してきたのでそろそろ振り返ってまとめたい— 広島の粗大ゴミ (@ohbarye) 2018年9月27日 だいたい2018年上半期の話ですが一部期間外の話もあります。 なぜアウトプットを増やすか 唐突ですが、現職では日常の業務を漫然と続けるだけで成長するフェーズは終わったのかなぁと思っています。新しく何ができるか、何をすべきか
GitHubでもっとも人気の言語はJavaScript、フォークされたのはTensorFlow。GitHubが今年の統計情報「The State of the Octoverse 2017」を発表
GitHubでもっとも人気の言語はJavaScript、フォークされたのはTensorFlow。GitHubが今年の統計情報「The State of the Octoverse 2017」を発表 GitHubは、2017年10月時点でのGitHubの利用者数やリポジトリ数などGitHubの統計情報をまとめた「The State of the Octoverse 2017」を発表しました。 今年で10年となるGitHubのユーザー数は2400万人、組織数は1500万。リポジトリ数は6700万個。過去1年で10億回コミットが実行され、1250万のアクティブなイシュー、130万回の新規プルリクエスト発行などが明らかにされました。 また、もっとも人気のある言語はJavaScriptが圧倒的で、次がPython、Javaが続いています。 もっともフォークされたプロジェクトはTensorFlow、次
優秀なプログラマになるために - @ledsun blog
みんな良いこと言うので、刺激を受けて考えたことを記録します。 生きてるだけで丸儲け ストレス対処法 撤退戦術 タスク殺すマシーン 人間に戻る儀式 運 技術力を身につける方法 車輪を再発明する 脱ゴールデンハンマー病 学習の助 優秀なプログラマとは？ おまけ 生きてるだけで丸儲け 優秀なプログラマーになるためのコツ · GitHub 優秀なプログラマーに「育つ」んだし、それには時間が必要 優秀なプログラマーになるということは、上記の通り長時間を要するということも踏まえると、メンタルヘルスにリスクがある環境に長時間暴露されることが不可避である 業界で長きにわたり活躍し続けている人というのは、それだけですでにひとかどの人物 すごく良いです。 優秀なプログラマになる前に、死んでしまっては元も子もありません。 生き延びることはなにより大切です。 幸か不幸か現状のIT業界はハードなストレスにさらされや
Announcing Yarn 1.0
Today, we are excited to announce the 1.0 release of the Yarn JavaScript package manager, a major step for the project. In the 11 months since its initial release, Yarn has generated a large following. Currently, there are more than 175,000 projects on GitHub with a yarn.lock file in their root directory. In use by many large and small companies, and across the open source community, Yarn is now r
Server-Side React Rendering | CSS-Tricks
Get affordable and hassle-free WordPress hosting plans with Cloudways — start your free trial today. React is best known as a client-side JavaScript framework, but did you know you can (and perhaps should!) render React server-side? Suppose you’ve built a zippy new event listing React app for a client. The app is hooked up to an API built with your favorite server-side tool. A couple of weeks late
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
nuxt.js/README.md at feat/new-fetch · nuxt/nuxt.js · GitHub
GitHub - swc-project/swc: Make the web (development) faster
GitHub - tensorspace-team/tensorspace: Neural network 3D visualization framework, build interactive and intuitive model in browsers, support pre-trained deep learning models from TensorFlow, Keras, TensorFlow.js
GitHub - leonardomso/33-js-concepts: 📜 33 concepts every JavaScript developer should know.
GitHub - victorqribeiro/imgToAscii: A JavaScript implementation of a image to Ascii code