![http://www.vivi-life.com/entry/2018/02/17/205006](https://cdn-ak-scissors.b.st-hatena.com/image/square/de094459252a65df2cc2c611005444a4136893e7/height=288;version=1;width=512/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fs%2Fstarceo-teo%2F20171215%2F20171215222903.jpg)
これは2017年の11月から独りでWebサービスを作りはじめて、独りでリリースをして、独りで打ち上げをした、独身男性の備忘録です。 開発からリリースまでの4ヶ月間、自分が開発中に心がけていたことなどを忘れないように、次のサービスに活かせるように、Qiitaに投稿しておきます。 また『Webサービス作るぞ!』と、独りで考えている方の参考になればと思います。 作ったもの OFFICECLOCK - クラウド型の勤怠管理サービス トップ画面 登録画面 勤務表画面 打刻画面 OFFICECLOCKは何ができるのか? ざっくり説明すると... Webブラウザで勤怠管理ができる 登録した勤務時間をエクセルで出力ができる HATARACLOCKとも連携しているため、LINEでの打刻、勤務表の確認もできる 【連携しているLINEアプリ】 ※このLINEbotとWebのサービスが連動している。 こだわり こ
これは、エンジニア未経験のど素人が、週末エンジニアとして PythonとFlaskでWebアプリを作成するためのメモ記事へのリンク集です。 Flask / Docker / Web開発 についてメモしていきます。 それぞれについて詳しくは、 下記のリンクを参照してくださいl。 [ランディングページ] このページ Flask -> flaskr起動&test編 Docker -> Dockerコマンド Web開発 環境 MacBook Pro OS: Sierra 10.12.2 Python Version: Python 3.5.2 :: Anaconda 4.2.0 (x86_64) Webフレームワーク Flask 仮想環境構築:Docker 動機 動機: ・仕事はRメインで構築しているが、RNNなどDeepLearning系も一旦扱えると面白そう(計算がBlackBox化している点
どうも、まさとらん(@0310lan)です。 今回は、JavaScriptでWeb開発をされている方や、これから勉強しようという方も含めてとても便利に使える無料オンラインエディタのご紹介です! バックエンドは「Node.js」でプログラミングして、フロントエンドは「HTML / CSS / JavaScript」で開発し、そのままホスティングもしてくれるので手軽に公開することも可能なスグレモノですよ。 【 Gomix 】 以前は「HyperDev」という名称でサービスが公開されていましたが、現在は「Gomix」というサービス名に変更されており、今も活発にバージョンアップが続けられています。 ■基本的な使い方! それでは、実際に「Gomix」を使いながらどのようなサービスなのかを見ていきましょう! まずは、ブラウザから「https://gomix.com」にアクセスすると、いきなりコード
僕が作ったものではありませんが、面白いコンセプトだなぁと思ったので紹介します。(株) レベルエンターの代表、山本さんがおひとりで開発されたサービスです。その名も「CODE写経」です。画像をクリックするとサービスのページにジャンプします。 写経はハードルが高い プログラムの文法に不慣れな初学者にとって、写経は少しハードルが高い。カッコを付け忘れるとか半角を全角で書くとか変数名をtypoするとか、コピペではない手段でプログラムを書こうとすると色んな罠があります。不注意と言えばそれまでですが、何が不注意だったのかもわからないのは可哀想です。 とにかく動くプログラムを書かないと、学習を先に進めることは出来ない・・・ 山本さんはプログラミングを教えるお仕事をされているので、間違えずに写経ができるサービスがあればと思ってこちらのサービスを開発されたそうです。 操作動画 youtu.be Chromeで
コードを試したい場合だったり、プログラミングの学習をしたりするときに、開発環境を整えるのが面倒なことはありませんか?今回は面倒なアカウント登録も不要で、ブラウザだけですぐにプログラミングができるWebサービスをご紹介します。 Runstant http://phi-jp.github.io/runstant/release/alpha/ 対応言語:HTML, CSS, JavaScript Web系のコードを試すときに便利なサービスです。エディタがSublime Text風のハイライトで見やすく動作もサクサクなので非常に使いやすいです。saveボタンを押すことでコードの情報が入ったURLが自動的に生成され、簡単に他の人にシェアすることができます。また、上のshareボタンを押した後にembed codeの内容を記事内に埋め込むとコードと開発環境自体も埋め込むことができます。Webデザイナー
最近では、プログラミングスキル世界中で注目され、学校の授業の一部にプログラミングを学ぶカリキュラムが取り入れられているほどです。 中には、小学生向けのIT教育として、専門の学校を設け、早期のIT人材育成に取り組む企業も存在しています。 今回は、プログラミングが独学、かつ無料で自宅学習できる20サービスをまとめました。 ドットインストール http://dotinstall.com/ 動画形式で、プログラミングを学ぶことができるWebサービスです。 基本的に、全ての動画が3分で完結し、隙間時間でも学べるボリュームが特徴です。 WordPress入門 、HTML入門 、iPhoneアプリ開発入門など、2015年4月現在で220レッスン、3,132本のカリキュラム動画が視聴可能です。 schoo https://schoo.jp/guest プログラミングだけでなく、ビジネスや美容関係など幅広い
エンジニアであればプログラミング技術の上達は欠かせません。練習の方法はいろいろありますが、プログラミングの問題をたくさん解くというのは、ゲーム感覚で遊びながらできておすすめです。 そうした遊びの要素を取り入れたプログラミングサービスの中でも、世界のエンジニアの間で人気の高い「HackerRank」をご紹介します。プログラミングの問題を数多く解けて、さらに、問題を解いた成果に応じて企業からのオファーももらえるというユニークなサービスです。 HackerRank リクルートも出資を決めた、プログラミングサービス「HackerRank」とは? 「HackerRank」は、世界中のエンジニアが、様々な領域のプログラミングの問題にチャレンジできるサービスです。2012年にローンチされ、多くのエンジニアに利用されています。2015年にはリクルートホールディングスが、「HackerRank」を運営するI
ここ最近、初心者でも簡単にプログラミングが学べるプログラミング学習サイトが増えてきています。手軽に活用できることがプログラミング学習サイトの良さではありますが、その分どれが本当に自分に合ったサイトなのかを判断することは難しいですよね。「どのプログラミング学習サイトがわからない…」とお考えのあなたに、独学で勉強できる学習サイト18つをまとめて紹介します。このまとめでは、基礎の基礎から教えてくれるものから、ひとつの学習サイトを極めるだけでWebサービス開発の基礎力がつくサイトまで様々な種類の学習サイトを紹介しています。各スクールの特徴やオススメポイントを参考にして、ぜひ自分に合ったお気に入りのサイトを見つけてみてください。
Photo by jmettraux こんにちは。谷口です。 「プログラミングを勉強してみたい」という方はたくさんいらっしゃるかと思います。その一方で、全く未経験のプログラミングを独学で学んでいくということに対して、「ハードルが高いな~」と感じる部分もあると思います。 そこで今回は、Web上でプログラミングの基礎を学べるサービスや、ブラウザ上でコードが実行できるサイトをまとめてみました。今はほぼ無料の学習サイトでも、未経験からWebアプリを作れるレベルのことまで学べるサービスがたくさんあります。 プログラミング学習というのは、コストをかけなくとも充分に初めの一歩を踏み出すことができますのでぜひ挑戦してみてください! ■プログラミングを学びたい人がつまずきやすいポイントと課題 プログラミングを学ぼうとしている方は、以下のようなポイントでつまずいたり、課題を抱えたりしている方が多くいらっしゃる
Thesaurus.comとは Thesaurus.comは、英単語の同義語と反意語を検索することができる英語辞典サービスです。 Thesaurus(シソーラス)とは、分類語彙辞典とか、類語辞典とか、言葉の宝庫みたいな意味があります。そのまんまですね。 類義語・反意語検索 例えば、make(作る)で検索した場合、以下のように「類義語」と「反意語」が表示されます。 これらの結果は、デフォルト状態で、関連性の高い単語から順番に表示されます。(Thesaurusによるランク付けです。) ですので、同じ「作る」という意味の関数名をつけるとしても make_xxxxxxx() とはせずに、生成するようなものだったら、 generate_password() みたいにした方が良いかなとか、まとめて構成するようなものだったら、 compose_xxxxxxx() にした方が良いかなど、ある程度、関数内の
今回は大阪中心部のIT・情報系の専門学校をまとめました。 資格やスキルなど特化した学校もあるため、自分に合った学校を見つけましょう。 田島悠介 今回は、なにか相談受けたんだって? 大石ゆかり 大阪に住んでる親戚がIT系の専門学校に通いたいって言ったんですが・・・どこを選べばいいかわからなくて・・・ 田島悠介 よし!それじゃ、自分にあったIT系専門学校の選び方と大阪にある学校を紹介していくね! 大石ゆかり お願いします! 目次 自分に合った学校の選び方 学費を抑えられる学校 資格が充実している学校 プログラミングを学習できる学校 実習の多い学校 就職サポートが充実している学校 まとめ 自分に合った学校の選び方 これからIT系の知識・スキルを習得したいと考えている方は多いでしょう。 IT系の専門学校に興味を持ってもどの専門学校に入学すれば良いのか、自分にはどの専門学校が合っているのか考えること
Photo by Jason Cartwright こんにちは。谷口です。 プログラミングの勉強で「ちょっとあの開発言語の勉強をしてみたいな~」「実際にコードを書いて動かしてみたいな~」という時に、ハードルとなるのが「実行環境の作成」だと思います。 そんな時に役立つのが、書いたコードをブラウザ上で実行できる「オンライン実行環境サービス」です。 今回は、実行環境の手間を省いて「書いたコードをブラウザ上で実行できる無料サイト」を紹介します。 目次 ・複数言語対応系 ・ideone ・CodePad ・paiza.io ・repl.it ・Codecademy ・runnable ・Wandbox ・SourceLair ・JavaScript系 ・JSFiddle ・jsbin.com ・Codepen ・jsdo.it ・PHP系 ・PHPfiddle ・PHP Sandbox ・Write
こんにちは。今回は谷口が担当します。 paizaはこの度、ITエンジニア向けの無料オンラインプログラミング実行環境サービス『paiza.IO (パイザ・アイオー)』 のβ版を、本日2014年11月17日からサービス開始いたしました。 『paiza.IO』は、ブラウザ上でコードが書け、書いたコードをその場で実行出来るオンラインプログラム実行環境です。 ブラウザだけでプログラミングがすぐ始められる【paiza.io】 from paiza on Vimeo. ■オンライン実行環境について ◆どうしてpaiza.ioを作ったの? これまでプログラミングを始める際、最大のハードルは「プログラムの実行環境を構築する事」でした。 これまでは、環境構築といえば初心者にとってハードルが高く、ものによっては細かい部分でつまづいたりなどして1~2日程度はかかる工程の面倒な作業でした。そのボトルネックを解消し、
2017年2月17日 便利ツール 作業中に、ふと動作確認がしたい…でも新規ファイルを作るのすらめんどくさい…なんてこと、ありませんか?(え?ない?w)そんな時はファイル不要!環境設定不要なオンラインテストサイトを使っちゃいましょう!動作確認用オンラインツールはいくつかありますが、実際に使っているもの、ブックマーク登録しているものをいくつか紹介します!ユーザー登録してコードを保存できるサイトもあるので、備忘録として使ってみてもよさそうです! ↑私が10年以上利用している会計ソフト! CodePen Webクリエイターボックスでも何度となく紹介してきたCodePen。フロントエンドの動作確認に最適です。Emmetの利用もOK!ライブプレビューができるので、いちいち保存したり実行ボタンをクリックして動作確認する必要はありません。作成したコードをブログへ埋め込んだり、シェアするのも簡単! HTML
ある正規表現に対して、特定の文字列がマッチするかどうかをチェックするツールやサイトは沢山ありますが、正規表現そのものが何を意味しているのか、どんな文字列を期待しているのかを解析・解読・説明してくれるツールやサイトってなかなか見ない気がします。 他人の書いた正規表現を見て、「ん?」ってなったことはありませんか? 例えばこれ。 1 ^[a-zA-Z0-9-_.]@([a-zA-Z0-9_-]+\.)+[a-zA-Z]{2,4}$ これくらいなら分かりますが、複雑になってくるとつらい… いつかはマスターしたいけど…今は楽したい。 そう思ってググってみると…ありました! それがこちら。 Regexper http://www.regexper.com/ 正規表現を入力して Display をクリックすると、その正規表現が表す内容を図にして表示してくれます。 例えば先程の正規表現は、当記事の一番上の
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く