Cursor の無料版を使い続ける場合の設定 - Qiita
Cursor の Pro 版でサポートされる AI 機能は非常に強力であり、無料版と比較して多くのメリットがあります。しかし、個人開発者や学生など予算に限りがある人にとっては、Pro 版の利用は難しい場合があります。 本記事では、無料で利用できる Gemini, Roo Code, Cody を設定することで、Cursor の無料版で少しでも Pro の使用感に近付ける方法を紹介します。 概要 Cursor の無料版でも最低限の基本機能は利用できます。 AI Chat でのメンション：Codebase (RAG)、Git、ファイル指定 RAG を構築する手間が不要 Git 機能は、コミットメッセージを生成するのに便利（特に英語でコミットメッセージを書く場合） ファイル内容をブラウザの AI にコピペして質問して、その回答をまたコピペで持って来るような手間が省ける [Ctrl]+[K] によ
Web系エンジニア最低限入れておくべき Chrome 拡張機能３選 - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 概要 Web ブラウザではすっかりお馴染みの Google Chrome ですが、開発者ツール（DevTools）だけでなく、拡張機能にも導入すると非常に便利なものがたくさんあります。 その中でも、Web系の開発をするエンジニアなら、是非入れておきたいオススメの Google Chrome 拡張機能について紹介します。 尚、いずれも無料で利用可能です。 IT エンジニア界隈では、既にどれも有名なものばかりですが、これから Web 系の開発をする方は是非お試しください。 本当はもっとたくさんオススメしたい拡張機能がありますが、ひとまず今回
翻訳: WebAPI 設計のベストプラクティス - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? これは Enchant の開発者である Vinay Sahni さんが書いた記事「Best Practices for Designing a Pragmatic RESTful API」1を、ご本人の許可を得て翻訳したものです。 RESTful な WebAPI を設計しようとすると、細かなところで長考したり議論したりすると思います。また、他の API に倣ってやってはみたものの、本当にそれでいいのか、どうしてそうしているのか分からない、何てことも少なくはないと思います。 この記事では、そのようなハマリどころについて Vinay さん
身の丈にあったWebAPI設計ガイドラインを作った話 - Qiita
こんにちは。フリーランスエンジニアの@dayoshixです。 現在、リンクアンドモチベーションのモチベーションクラウドの開発に、主にフロントエンドエンジニアとしてお手伝いさせて頂いております。 そのようなご縁もありモチベーションクラウドのアドベントカレンダー（３日目）に参加させて頂くことになりましたので宜しくお願いします！！ トップバッターの@ishigeさん、２日目の@HayatoKamonoさんお疲れ様でした！！ お二人の記事はこちら。どちらも力作なので宜しくお願いします。 1年半取り組んだWebプロジェクトマネジメントを振り返って、やって良かったこと、やっておけば良かったことをすべて書く Vueを用いた開発プロジェクト用にカスタムジェネレーターを作ってみる ということで始めたいと思います。 概要 最近モチベーションクラウドのWebAPI設計ガイドラインが作成されたのですが、それはどの
Vue3をアゲアゲ↑↑する記事 - Qiita
はじめに こんにちは、フロント歴7年目のエンジニアになります🙂 今回は日頃仕事でお世話になっているVue.jsに感謝の意を込めて、 Vueの素晴らしさを皆さんに少しでも感じて貰えたらと思い、この記事を投稿することにしました。 アゲアゲするとか言って 「どうせSFCが便利とか言いたいんでしょ？」 「script setupが凄く凄いとか言いたいんでしょ？」 ・・・いえいえ、そんな当たり前のことを話したいわけではありません。 もっと深いところの説明だったりをですね、 「いやでも最近のVue3はReactに似ているから、それならReactで良くね？」 全く良くないです はい、そういった人達にこそ見て欲しい内容となっております。 つまり私がVueが優れていると信じ使い続ける理由です。 それでは見てきましょう！ 1. fine-grained Reactivityであること 2. out of b
Nuxt.jsで認証認可入り掲示板APIのフロントエンド部分を構築する #4 サインアップページの作成 - Qiita
<template> <v-app id="inspire"> <v-main> <v-container class="fill-height" fluid > <v-row align="center" justify="center" > <v-col cols="12" sm="8" md="4" > <form @submit.prevent="signUp"> <v-card class="elevation-12"> <v-toolbar color="primary" dark flat > <v-toolbar-title>SignUp form</v-toolbar-title> </v-toolbar> <v-card-text> <ul v-if="errors"> <li v-for="(message, i) in errors.full_messages" :
setTimeout の真の力、あなたは知っていますか？ - Qiita
大雑把な理解としては問題ないですが、実は setTimeout の隠された能力はそれだけではありません。 setTimeout の隠された能力を知るとどんな良いことがあるのでしょうか？ 例えば、次のような良いことがあります。 ブラウザに対する理解が深まる Web サイトのパフォーマンスを向上させることができる ドヤれる まず、 ブラウザに対する理解が深まります 。 かのアリストテレスはこう言い残しました。 Knowing setTimeout is the beginning of all wisdom. ( setTimeout を知ることは、すべての知恵の始まりである) setTimeout を知ることは（ブラウザの）すべての知恵のはじまり と言って過言ではありません。 普段なにげなく setTimeout を使っていても、「実はブラウザは裏でこんなことしているんだー」という新しい知見
Jest・Supertestを使用したnode.js(Express)のAPIテスト app.listen()はエラーになる - Qiita
Jest・Supertestを使用したnode.js(Express)のAPIテスト app.listen()はエラーになるJavaScriptNode.jsExpressテストJest はじめに Jest・SupertestでAPIテストを作成した際に躓いたので、その実装の備忘録を残しておく。 この記事ではnode.js(Express)のAPIテストを実行できるようになる部分までを記載した。より実践的にはAPIテストのエンドポイントのメソッドでWeb APIをcallしているような場合は、それをmock化してWeb APIがcallされないようにすべきであるが、それについてはmockを使ったNode.js(Express)のAPIテストを参照。 （実際にテストを作る中でトラブって困った事もトラブった事として残した。） どうやってExpressのAPI(End Point)テストをjes
Laravel ルーティングファイルは増やしていい - Qiita
Vue + Vue Router + Vuex + Laravelで写真共有アプリを作ろう (4) 認証API | Hypertext Candy https://www.hypertextcandy.com/vue-laravel-tutorial-authentication これの間違い。 routes/api.phpをwebミドルウェアで使うためにRouteServiceProviderを変更してるけどこれはやめたほうがいい。 フレームワークはルールなので普通と違うことをするならそれなりに理由が必要。 例えば後から何も知らない人が参加して気付けるか？と考えると難しい。それどころか変更した本人でさえ数ヶ月後には忘れる。 ではどうすればいいのか。（web.phpに書けば終わるけど他の方法） RouteServiceProvider::map()の// このたった2文字がヒントだけどルー
Lambda(Python)でGoogle Driveへファイルアップロード - Qiita
Lambda(Python)でGoogle Driveへファイルアップロード この記事はサーバーレスWebアプリ Mosaicを開発して得た知見を振り返り定着させるためのハンズオン記事の1つです。 以下を見てからこの記事をみるといい感じです。 Lambda(Python) + Rekognition で顔検出 イントロダクション S3ってファイルを保存するだけならいいのですが、そのファイルを人が参照するのには向いてないですよね。画像にしてもWebブラウザ上でそのまま見ることができず、一度ダウンロードしてから見る必要がある。ちょっと手間なんですよね。 その点、Google DriveはPCにしろスマホにしろ、ブラウザやアプリでいい感じに画像を参照することができますのでいい感じです。 コンテンツ Google Developers Console プロジェクトの作成 GoogleのDevelo
個人開発・スタートアップで採用すべき最強のアーキテクチャを考えた - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 結論 「アジリティ」「コスト最適化」「スモールな構成」「開発スピード」という観点でWebアプリケーションのアーキテクチャを考えてみました。 ServerlessFrameworkを使い倒す フロントエンドはS3 hosting + CloudFrontで。SSRもLambda@Edgeでできます データベースはRDSは使わずにDynamoDBで APIは基本的にGraphQL。必要に応じてRESTも簡単に追加できるよ。 補足(2022/04/12) 最近個人開発しているこちらのWebサービスはこのアーキテクチャに沿って作られています。
フルスタックエンジニアになるためのモダンな8つのプロジェクト - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? こんにちは、たかとーです。 今日は8 Projects with modern designs to become a Full-stack Master 2020の日本語訳記事です！ *当記事は、Thuさんの許可を得て翻訳しています。 ブログでも読めます！ 8 Projects with modern designs to become a Full-stack Master 自分のスキルを磨くためのプロジェクトを探していますか？新しいアイデアを思いつくのに行き詰っていませんか？ 開発者として、私たちはコードを書くのが大好きですが、デ
AWS公式『現代的なウェブアプリケーションの構築』ハンズオンのハマリどころ - Qiita
AWSは、AWSのサービスを活用した実践的なハンズオンコンテンツを多数公開しており、 日本語化もされています。 アマゾン ウェブ サービス (AWS) の実践的チュートリアル https://aws.amazon.com/jp/getting-started/hands-on/ 社内向けにコンテナやAPI Gateway初学者向けのハンズオン教材を探していたところ、 ちょうどいいチュートリアルをみつけました。 現代的なウェブアプリケーションの構築 https://aws.amazon.com/jp/getting-started/hands-on/build-modern-app-fargate-lambda-dynamodb-python/ このチュートリアル、 ECS/Fargateを活用したコンテナアプリケーションの公開 Codeサービスを活用したCI/CDパイプラインの構築 Ama
2020年後半版Vue.jsを使ってる人には必ず知っていてほしいドキュメントに書かれていないComposition APIのコードの書き方とVuex vs provide/inject - Qiita
まえがき 最近iCAREさんの所で Vue.js を一緒にやらせていただいているのですが、フロントの技術スタックがかなりモダンであり、開発体験が良く、ノウハウをどんどん公開して良いと言っていただけたので、その内容を共有するシリーズです. 今回の記事の内容はiCareさんのDev Meetupで話した内容になります. 最近公式のソースを追った所、 Composition API はapiの紹介はあれども、コードの書き方やその背景、Tips等は全然見当たりませんでした. また、すごく強力なapiである provide/inject の紹介も全然見当たりません. 今回はiCAREさんの所で Vue.js を書く際に皆で意識している Composition API と活用している provide/inject のノウハウとその詳細な理由を共有します. ※ 直接編集リクエストをくれていつもありがとう
RESTful APIのURI設計(エンドポイント設計) - Qiita
HTTPメソッドとURI HTTPメソッドとエンドポイントは切っても切れない関係にある。URIがリソースを表すものだとすると、HTTPメソッドは操作(何をするか)を表すものである。1つのURIのエンドポイントに異なるメソッドでアクセスすることで、情報を取得するだけでなく情報を変更したり、削除したり等のさまざまな操作を行うようにすることで、リソースとそれをどう扱うかをきちんと分離して扱うことができる。これはHTTPメソッドの本来の考え方に合致しており、Web APIではこの考え方に沿って設計を行うことが主流となっている。各HTTPメソッドについては以下を参照。 リソース指向アーキテクチャの統一インターフェース URI設計 リソースにアクセスするためのURI設計の注意点 1.複数形の名詞を利用する 基本的にリソースは「集合」を表すものであるため、複数形の方が適切である。また、HTTPのURIは
静的サイトジェネレーター Gatsby - Qiita
静的サイトジェネレーターとは？ Static Site Generator（SSG） WebサイトのHTMLファイルを生成するツールのこと Wordpressのような従来CMSの仕組みは、MySQLなどのDBをもとに、サーバーでHTMLを生成して返すものだった それに対し静的サイトジェネレーターは、コンパイル時にGraphQLやAPIからすべてのデータを取得し全てのHTMLを最初に生成する さらに、生成されたファイルを、Netlifyなどのホスティングサービスを用いて、サーバーレスで公開する仕組みが主流になっている 静的サイトジェネレーターのメリット ※ Netlifyなどホスティングサービスを用いた場合 レスポンスが速い。サーバーでHTMLを動的に生成しないから サーバー代 ¥0✨ サーバーが必要ないため サーバー落ちない。メンテが不要 ※ ただしホスティングサービスが落ちる可能性はあり
Visual Studio CodeからQiitaに投稿できる拡張機能をつくってみた - Qiita
VSCodeで編集中のMarkdownファイルを一発でQiitaに公開できるスマートな拡張機能があればいいな〜と思ってGoogleで検索したら こちらの記事 がヒットしたのですが、どうやら開発が滞ってしまっていたようで、同様のものを開発しても良いかをコメントでお尋ねしたところ快諾してくださったので公開してみました。 GitHub （★ください） インストール （現時点ではプレビュー版です） 途中でTypeScriptのコンパイラーのバグを踏んでデバッグできなくなって発狂しそうになりましたが、なんとか必要最低限の機能は実装できたので所感を書いておきます。 Visual Studio Codeの拡張機能について VSCodeの拡張機能は基本的にTypeScriptで実装できます。直接DOMの操作ができず、提供されたAPIの中で頑張らなくちゃいけない設計なので、はじめは覚えるのに苦労すると思いま
アプリで「ログインしっぱなし」はどのように実現されているか？ - Qiita
このツイートを見て、「アプリで再ログインを頻繁要求されるってユーザビリティ良くないな。」と思ったのですが、普段裏側の仕組みは意識していなかったりテックリードの方に任せきりだったりしていたので、これを機に調べてみました。 そもそもスマホアプリ の時代、もはやauthenticationですらないと思うのよね。（何を言ってるかわからねえだろうと思うが。） — Hiromitsu Takagi (@HiromitsuTakagi) 2019年7月8日 この記事は「アプリでログインしっぱなしは、どのように実現されるの？」という疑問と調べた結果を共有するために書いていきます。 間違いや「もっとこんな仕組みが使われてるよ！」等のツッコミがあれば、どしどし貰えると助かります！ 疑問1. アクセストークンという仕組みとは？ 「なぜアクセストークンという概念が必要なのか？」 モバイルアプリでユーザー認証をし
一番分かりやすい OAuth の説明 - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? はじめに 過去三年間、技術者ではない方々に OAuth（オーオース）の説明を繰り返してきました※1,※2。その結果、OAuth をかなり分かりやすく説明することができるようになりました。この記事では、その説明手順をご紹介します。 ※1：Authlete 社の創業者として資金調達のため投資家巡りをしていました（TechCrunch Japan：『APIエコノミー立ち上がりのカギ、OAuth技術のAUTHLETEが500 Startups Japanらから1.4億円を調達』）。Authlete アカウント登録はこちら！ ※2：そして２回目の
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Nuxt.jsでAuth Moduleを使ってログイン機能を実装する - Qiita
