自作した時間割アプリが大学の公式アプリに採用された話 - Qiita
記事の概要 私（芝浦工業大学学部4年生）が大学3年時に1人で制作した、大学のポータルアプリ（ポータルサイトからスクレイピングして時間割などを表示する）が、大学に正式採用され、公式アプリ"ScombApp"としてリリースされるに至った経緯を時系列順に説明します。 ホーム画面 時間割画面 制作の動機 大学のポータルサイト使いにくいがち。 ポータルサイトのスマホアプリ版があれば便利そう。 他にやってる人いなさそうだし、最初に作ったらみんな使ってくれそう。 ポータルサイトの問題点 大学ポータルサイトで使いにくかった点を挙げていく。 とりあえずこれを克服することを目標にした。 ログインの時に自動補完が使えない 制作当時はBASIC認証で、スマホからだとログインの自動補完ができなかった。 毎回手打ちでパスワードを入力している人がほとんど ←！？ 次の授業や教室を確認するだけでも、毎回手打ちログインが必
MVCモデルは意識した方がいい！！！私は地獄を見ました！！！ - Qiita
目次 MVCモデルとは何者？？ Modelとは Viewとは Controllerとは まとめ （MVCを意識せずに書いた私の経験談） MVCモデルとは何者？？ MVC（Model-View-Controller）モデルは、ソフトウェア開発におけるデザインパターンの一つ。MVCはアプリケーションの内部の構造を整理し、役割を分離することで、保守性や拡張性を向上させることを目的としているもの。 Modelとは モデルはデータの管理や処理、データベースとのやり取りなどを行うもの。 バリテーションも行う。 Viewとは ビューはユーザに表示されるもの。 例えばHTMLやJSなど Controllerとは ユーザーの入力やアクションを受け取り、それに応じた処理（モデルのデータを取得・更新）をし、最終的な結果をビューに渡すもの。 言えばMVCモデルの頭。 まとめ（経験談） 初めは全く気にしないで書いて
今時のフロントエンド開発2017 (1. 愚痴編) - Qiita
良いものを書きたいので指摘などは大歓迎です。 その際はコメントや編集リクエストをいただければ修正します。 大きな変更が加わるときは通知すると思います。 はじめに これまでのフロントエンドの開発には多くの問題や面倒ごとを抱えています。 その解決手段としてよくビルドツールやaltJSといったワードを目にしますが，これらがどういった目的で利用されているのかについて触れながら進めていきます。 主にパッケージ管理やビルドツールを初めて見る人向けになっているので全編通すとそれなりに長いです。 動かすまでが長めになっていますが理解してしまえば本当に必要な手順はさほど多くありません。 実際に開発を始めるために必要な準備はせいぜい1~2つのファイルを記述してコマンドを数回叩く程度なので，過度な抵抗感を持たずに読んでいただけたらなと思います。 登場するツールや技術は多くの問題を解決してくれますが，これらは飽く
Rails と Vue.js でWebサービスの環境を作ってみた - Qiita
はじめに Railsを勉強し始めて、そろそろオリジナルでWEBサービス（比較サイト）を作ろうと思い、色々と調べつつ構築していったら勉強になったのでメモしていきます。今回は、Rails,Vueを使って開発したかったので、それに合わせた環境になっています。 この記事では以下の環境（2018年7月9日時点）で動作確認できました。 Ruby: 2.5.1p57 (2018-03-29 revision 63029) [x86_64-darwin17] Rails: 5.2.0 mysql2: (>= 0.4.4, < 0.6.0) mysqlはdockerに作成してあります Docker version 18.03.1-ce yarn: 1.7.0 webpacker: (~> 3.5) vue: ^2.5.16 参考にしたレポジトリ プロジェクトを作る上で参考にした、サービスのレポジトリは以下で
SQLをゼロベースで学んだ時に出会う用語まとめ - Qiita
合わせて読みたい はじめに 自分が勉強するときにつかった図書は スッキリわかる SQL 入門 ドリル215問付き! です。 とてもわかり易い。これを用いながら メモしてあった文法一覧。 これからSQLを勉強される方は ぜひご一読ください。とても わかりやすいです。 Structured Query Language 【特徴】 ・命令自体は単純で、数も少ない ・修飾語をつけることで複雑な処理も可能 RDB Relational Database 複数の表の形式でデータを管理すること DBMS Database Management System SQLを送る相手。SQLの内容にしたがって データベースファイルの内容を検索したり、 書き換えたりする処理を実行してくれる。 DML Data Manipulation Language SELECT, UPDATE, DELETE, INSERTを
プロダクトのドキュメントにプルリクエストを送れる仕組みがすごい - Qiita
これ↓なんですけど、意外と RT や Like が付いてたので、ちゃんと書きますね。 しっかしMicrosoftのドキュメントシステム良く出来てるなー。右のEditボタン押すとGitHubが開いてすぐPR送れる。あちらでマージされれば即サイトに反映される。Contiributorsに自分のアイコンが増えた♪ これはフィードバックするのに「面倒」は理由にできないですぞ。https://t.co/9KhAwhV5PP pic.twitter.com/r46zFUvkEp — あめいぱわーにおまかせろ! (@amay077) 2018年6月12日 このツイは Microsoft の製品やサービスのドキュメントについてなんですが、 Microsoft Docs というポータルがありまして、同社のサービスの多くはここでドキュメント公開されている模様です。 ここで公開されているドキュメント群は、バック
Netflixがカスタマーを誰よりも理解するためのデータ分析プロセス、コンシューマー・サイエンスの紹介 - Qiita
時間がたつに連れて、私のフォーカスは、「カスタマーが何を言っているのか？」から、「まずはテストしよう！」というコンシューマー・サイエンスの態度に変わりました。私のチームのカスタマーに関するインサイトは向上し、学びの速度も上がり、何がカスタマーを喜ばせるのかについてのある仮説を形成するに至りました。 以下が、コンシューマー・サイエンスとカスタマーオブセッションのために私達が使ったリサーチの手法です。 既存のデータを使って過去と現在のカスタマーの行動を理解する。 私達の作っているものに対してカスタマーがどう反応するのかを聞くために、フォーカス・グループや一対一のインタビューやユーザーテストといったクオリティティブなリサーチをする。 カスタマーがどういった人たちなのかを、デモグラフィック（人口統計学的属性、つまり性別、年齢、住んでいる地域、所得、職業、学歴、家族構成など）、競合する製品の使用度、
Twitterの名前を5分毎に東京の天気⛅☂☃と連動させるサーバレスプログラムを書いたら色々知らないことが出てきた話 - Qiita
みんなが使えるようになりました(追記 2018/11/20) 【祝】Twitterの名前をお天気と連動されるアプリを作った時の技術的な紹介【公開した🌥️】 導入 みなさんこんにちは！ 私は将棋プログラムPonanzaの作者、山本一成といいます。Qiita初投稿です。よろしくおねがいします。 いつものようにTwitterをしていた時、ふと思ったんです。 「Twitterの名前の部分が天気のEmojiと連動して変わったら嬉しいな」 つまりこんな感じですね ↓ いつもは、C++など低いレイヤーのプログラムを書くことがメインなので、こういったプログラムを書いたことがあまり経験がないのですが、よしいっちょやってみるかと思ってやってみました。 技術選択 さっそく技術選択の段階です。 こういう類のプログラムは技術の選択がとても大切です（たぶん）。 正しい技術選択をすればとても幸せなのですが、間違えると
フロントエンドのコンポーネント設計に立ち向かう - Qiita
ReactやVueなどコンポーネントベースで作っていくViewのライブラリが普及したことで、コンポーネント指向での開発が一般化してきた昨今のフロントエンドですが、このコンポーネントの設計に悩まれる方も多いのではないでしょうか。 コンポーネントをどの粒度、どんな状態で分割するのが良いのか、などなど、特にチームで開発する時に認識が揃っていないとカオスになりがちな部分であると思うので、自分なりの設計をする際の指針を言語化しようというのが本記事の目的です。同じように悩まれている方にも何らか示唆を提供することができたら嬉しいです。 想定読者 「コンポーネント設計？なにそれ？おいしいの？」という方 初めてコンポーネント設計でアプリ作ってみたけど、本当にこれでいいのか自信の無い方 はじめに: "コンポーネント"とは まず最初に"コンポーネント"という言葉についてですが、ここでは「GUIのパーツをモジュー
GitHub Issuesでブログを作る - Qiita
GitHubのIssueをNuxtとNetlifyでブログ化するというのをやってみたので解説します。 デモサイト： https://gh-blog.netlify.com/ Issues： https://github.com/miyaoka/gh-blog/issues Headless CMS はじめにHeadless CMSについて解説しておきます。旧来のAPI無しのWordPressのような一体型CMSではなく、コンテンツ管理部分を切り離してAPIでやりとりできるようにするのがHeadlessなCMSです。これによりフロントの実装やデプロイが疎結合になり、好きにできるようになります。 例としてCMSにContentful、デプロイにNetlifyを使う構成だとこんな感じになります。 参考） 次世代Headless CMS「contentful」事始め - Qiita Nuxt.js
エンジニアとして成功するための大事なことトップ3 - Qiita
Youtubeの要約です。 先日すごく感銘を受けた動画を見ましたので、シェアさせてください。 もっと短く要約しようと思ったのですが、ほとんど和訳になってました。ところどころ省略しているところもありますので、全文訳で無いことは注意です。 3 top qualities for a Software Engineer to be successful Techlead Google Youtube Patrick Shyu 【導入部分】 手を早く動かす事はとても大事。何も意味がなくても、キーボードを早く叩いたり、マウスを動かしたり、「早く動く真似事」をするだけでも体が早く動く事に慣れるので、普段からやっておくと良い。 1 【インパクト】 エンジニアにとって重要なのは、単にとても多くのバグを無くすだけでも、リファクタリングするだけでも、フレームワークを作るだけではないです。 重要なのはポジティブ
「Docker」を全く知らない人のために「Docker」の魅力を伝えるための「Docker」入門 - Qiita
「職場の人たちにDockerをもっと訴求したい！」そんな想いから、「Dockerって何？」といった方々にDockerの魅力を伝えるための記事を書いてみました。 Dockerのインストール方法については、『Amazon EC2にDocker CEの環境を構築する』にまとめています。併せてお読みください。 「Docker」とは 「Docker（ドッカー）」は近年大変注目されている 仮想化ソフトウェア です。 2017年の企業におけるDockerの導入状況は「本番環境で使用している」という企業が6.0％、「開発／テスト／検証段階」の企業が13.1％であったようです。（「2017年 国内OpenStack／Dockerの導入状況に関するユーザー調査結果を発表」） Dockerが注目されている一番の理由はその 手軽さ です。Dockerを使えば、以下のようなサーバー環境を簡単に構築することができます
2018年のフロントエンドエンジニアならこの程度は知ってて当然だよな？ - Qiita
可及的速やかにReactが絶滅しますように。 以下はFront-End Developer Handbook 2018の第三部、Front-end Developer Toolsからリンクされているツールと、その簡単な紹介です。 ドキュメントツール 開発者向けドキュメント、APIリファレンス Dash 200以上のAPIリファレンス、100以上のチートシートを一括ダウンロードできる。有料、Mac用。 DevDocs 200以上のライブラリをオンラインで検索できる。無料。 Velocity 中身はDashと同じ。有料、Windows用。 Zeal Windows、Linux、MacOS用各種揃っている無料のオフラインドキュメント。 チートシート devhints.io JavaScript、CSS、Go、vim等のショートカット、書式などチートシート。字が薄くて見辛い。 SEOツール Key
「中年の危機」ど真ん中のオッサンがWEBサービス作ってみた。 - Qiita
自己紹介 こんにちは。 Hirozといいます。 タイトルにある「中年の危機」は、かっこよく言えば「ミッドライフ・クライシス」と言うそうです。 私は、そんな中年の危機ど真ん中の文系非エンジニアのアラフォーおっさんです。 35歳くらいから「このままでいいのか」と思うようになり、葛藤の迷宮に入り込んでしまいました。 今もまだ抜け出せていません、たぶん。 その過程で「組織の肩書きによらない素の自分の力でやってみたい」、「直接人の役に立つ実感が得られることがしたい」と思うようになり、それを具現化する手段としてWEBサービスを造ってみたいと思うようになり、2017年12月にWEBサービスをリリースしました。 自分でプログラミングを習得しながら作るぞと思ったのが2017年の2月。 開発環境作りなどのトラブルに翻弄され、本格的にコードを書き始めることができたのは2017年の5月末。 そこからコツコツと開発
エンジニア歴20数年の私が、設計書を書く際に心がけていること - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? はじめに 時の経つのは早いもので、私がIT業界に身を置いて四半世紀になってしまいました。 その間、膨大な数の「設計書（仕様書）」を書いて来ましたが、未だに悩み・迷いは尽きません。 それでも、亀の甲より年の劫とも申しますので、私なりの経験則を「個人」と「チーム」の両観点でまとめてみました。 本稿のテーマは、「主に設計書を想定した、開発ドキュメントの書き方」です。 本稿で前提とする設計書は、ExcelやWordで書かれた、フォーマルな（≒納品物になりえる）設計文書、です。 したがって、自社サービス開発よりも受託開発、アジャイルよりもウォータ
裁判所、faxやめるってよ - Qiita
裁判所がfaxを使う運用を変更し、新しいシステムを導入するらしいという噂を聞きました。 米国では2001年からPACERがweb閲覧できて、シンガポールでは2世代目のシステム構築が進んでおり、韓国の裁判のIT化のシステムはベトナムへ輸出されているというのに、未だfaxを使っているとは。失われた20年。わたくしが一番きれいだったとき、裁判所はfaxを使っていたことを知りました。 少し調査をしたところ、日本の裁判所がfaxをやめるということは、いわゆる一行を変えるだけの問題とも関連していそうでした。ただ裁判所の運用が少し変わるだけではなく、もっと根本的な大きな変更が必要となってしまうような、そんな感じがしました。 少なくとも、議論の展開によってはオンライン会議/VR/ビックデータ/自然言語処理/機械学習が重要になってくる可能性があると思われたので、以下に自分が調べたことを共有させて頂きます。
San Francisco フォントを探る - Qiita
San Francisco Font Family San Francisco はひとつの書体ではなく、SF Pro, SF Compact などと呼ばれ、それぞれに Text, Display, Rounded バージョンが存在します。Text よりも Display の方が多くのウェイトを揃えているのは、Text は視認性を重視した書体ゆえ、細いものは利用する想定にないからなのだと思われます。SFシリーズはVariable fontに対応しています。 SF Pro vs. SF Compact SF Pro は macOS や iOS, tvOS デバイスのシステムフォントとして採用されています。SF Compact は Apple Watch のシステムフォントとして採用されています。Compact は字が四角形に近い形をしていて、Apple Watch のような小さなデバイスでも視
新人達を1ヶ月でガチvimmerにした方法 - Qiita
vim以外のエディタでコード書くと私の手は産まれたての子鹿みたいになります。 効率よくコーディングをしてもらうために、新人やvimを学びたい人にvimの研修を実施しています。今回は研修で非常に有効だった内容についてまとめておきます。 ※ なんだか誤解を生んでしまっているようなので追記しておきます。vimの研修は新人研修の一環として行ったわけではなく、vimを使って開発をしたがっていた新人へテスト駆動開発の研修を実施した際に並行して盛り込んだだけです。会社がvim強制とかではないのでご安心ください。言葉足らずで申し訳ありません。 2つの繰り返しキーの存在を認識させる vimは一度実行したコマンドの組み合わせを記憶する.(ドット)とfを使った移動の際のキーストロークを記憶しておく;(セミコロン)があります。これらを駆使することで他のエディタよりも高速な編集作業を行えます。 セミコロンはus配列
新QiitaでReactをやめてhyperappを採用した背景 - Qiita
12/1 に Qiita のトップページをリニューアルしました。これまで React を使っていましたが、それをやめて hyperapp を採用しました。まわりを見てもあまり採用事例が見当たらないので、この記事では一体なんで今をときめく React ではなく hyperapp を選択したのか、どういうところが魅力的なのかについて プレゼンテーション層を実装するためのツールとして 学習コスト の観点から書きたいと思います。なおこの記事に書かれていることは全て個人の感想であり、はっきりいって個人の日記レベルです。 それと hyperapp の開発者が社内にいるという事情もあるので、そこら辺さっぴいて読んでください。 TL;DR プレゼンテーション層を実装するためのツールとして React は機能過多だし、機能不足 hyperapp は過不足ない 学習コスト 仮想 DOM は学ぶ価値のある知識
エンジニアが最高のUIをつくるためのプロトタイピング方法まとめ（2017年版） - Qiita
こんにちは、 UXデザイナーの @yuh_iw です。 この記事は NTTコミュニケーションズ Advent Calendar 2017 の23日目です。 すべては最高の体験のために 弊社では、ようやく社内にUXデザインという言葉が浸透し始めていますが、 実態はUIと共に語られることが多いです。（実際は違うよ） とはいえ今回はUIを作るために私達がいつも行っていることについて記載します。 どうやってUIを作っていくのがよいか とにもかくにも、ユーザーに対する検証と学習をくり返すことです。 最高のUI=カッコイイUIではありません。アーティスティックなUIでもありません。 UIにはユーザーがいるので、ユーザーが使いやすいと思わなければならないのです。 そのために、使ってくれそうな人に、検証していく必要があります。 検証するためにはいくつか方法がありますが、 本稿ではUIプロトタイピングを行う
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
