新型コロナウィルスの感染拡大防止にあたりご確認ください

新型コロナウィルスの感染拡大防止の為、一定期間はお電話でのカウンセリングをご案内させていただきます。

みなさまの安全に配慮し、発熱や風邪の症状がある、海外渡航歴がある場合にも、電話カウンセリングをお願いしております。それ以外の方でも、交通機関での移動にご不安を感じられる方は同様に電話カウンセリングも可能でございます。一人一人に合った支援をさせていただきますので、ご希望がございましたら登録後カウンセリングに進む際にお申し付けください。

【翻訳記事】トップ開発者になる秘訣は、物事を構築すること!構築が楽しめるアプリのリスト!

Indrek Lasn氏がブログで投稿した記事「The secret to being a top developer is building things! Here’s a list of fun apps to build! (Posted Dec 1, 2017)」を翻訳してご紹介しています。
なお、この記事は原著者の許諾を得て翻訳・掲載しています。


素晴らしい開発者になるには努力するしかありません。少し想像してみてください。フィットネスに関する本をたくさん読んでも、物理的に体を鍛えることはできませんよね?実際にジムに行って、時間を使って汗をかく必要があるのです!コーディングにも同じことが言えます。

以下は、あなたのコーディング筋肉を鍛える8つの素晴らしいプロジェクトです!目標は、好きなテクノロジースタックを使ってそれぞれのアプリを構築することです。平穏に好きなものを使ってください!

プロジェクト#1:Trelloクローン

Indrek LasnによるTrelloクローン - デモリンク

Trelloクローンの構築から学べること:

・ルーティング

・ドラッグアンドドロップ

・新しいオブジェクト(ボード、リスト、カード)の作成

・入力および検証の処理

・クライアント側パス:ローカルストレージを使用する方法、ローカルストレージにデータを保存する方法、ローカルストレージからデータを読み込む方法

・サーバー側パス:データベースを使用する方法、データベースにデータを保存する方法、データベースからデータを読み取る方法

Reux + Reduxを使ったリポジトリの例はこちらです。

プロジェクト#2:ユーザー管理ダッシュボード

Githubのリポジトリ

初心者に最適なシンプルなCRUDアプリです。
学べること:

・ユーザーの作成、ユーザーの管理

・データベースとのやりとり - ユーザーの作成、閲覧、編集、削除

・入力の検証とフォームの操作方法

プロジェクト#3:クリプトカレンシー(暗号通貨)トラッカー(ネイティブモバイルアプリ)

Githubのリポジトリ

ネイティブアプリでなければなりません。Swift、Objective-C、React Native、Java、Kotlinで作れます。

学べること:

・ネイティブアプリの仕組み

・APIからデータを取り出す方法

・ネイティブレイアウトの仕組み

・モバイルシミュレータの使い方

このAPIを使用してください。これより優れたものがある場合は、コメントに投稿してください。

構築方法に興味がある方向けに、チュートリアル記事を書きました

プロジェクト#4:独自のwebpack設定を最初からセットアップすること

技術的な話をすると、これはアプリではありませんが、Webpackがどのように動作するかを理解することは目に見えないながらも重要な部分です。もはやそれは「ブラックボックス」ではなく、習得すれば強力なツールになります。

要件:

・es7をes5にコンパイルしてください(基本)。

・jsxをjsに、または.vueを.jsにコンパイルしてください(ローダーについて学ぶことができます)。

・webpack dev serverとhot module reloadingをセットアップしてください(vue-cliとcreate-react-appの両方を使用してください)。

・Heroku、now.shまたはGithubのページを使用して、プロダクションの構築を準備しデプロイしてください(Webpackプロジェクトのデプロイ方法を学ぶことができます)。

・好きなプリプロセッサをセットアップして、単純なcss(scss、less、stylus)にコンパイルしてください。

・Webpackを使って画像とsvgを使用する方法を学んでください。

全くの初心者向けの素晴らしいスターターキットのリソースはこちらです。

プロジェクト#5:HackerNewsクローン

誰もが独自のバージョンのHackerNewsを構築しています。あなたもやってみましょう。

学べること:

・HackerNews APIとのやりとり

・シングルページのアプリの作成方法

・コメント、単一のコメント、プロフィールの閲覧といった機能を実装する方法

・ルーティング

Hacker News APIのドキュメントはこちらです。

プロジェクト#6:Todoアプリ

TodoMVC

本当に?Todoアプリですよ?既にたくさんありますよ?はい、もちろん知っています。しかし、聞いてください。Todoアプリが人気の訳を。

Todoアプリは、基本を守るのに最適な方法です。ごく普通のJavascriptで構築してから、お気に入りのフレームワーク/ライブラリで構築してみてください。

学べること:

・新しいタスクの作成

・フィールドの検証

・タスク(完了済み、アクティブ、すべて)のフィルタリング。フィルターを活用して機能を減らすこと。

・Javascriptの基礎を理解すること。

プロジェクト#7:ソート可能なドラッグアンドドロップリスト

Githubのリポジトリ

ドラッグアンドドロップAPIを理解するのに非常に便利です。複雑なアプリを作成できる場合は、他より抜きんでることができます。

学べること:

・ドラッグアンドドロップAPI

・リッチUIの作成

プロジェクト#8:メッセンジャークローン(ネイティブアプリ)

ネイティブアプリとウェブアプリの仕組みを理解すると、他の人より突出することができます。

学べること:

・WebSocket(インスタントメッセージ)

・ネイティブアプリの仕組み

・ネイティブにおけるレイアウトの仕組み

・ネイティブアプリのルーティング

・・・

これらのアプリにハマると1~2か月間忙しくなるはずです。好きなものを選んで構築してみてください!あなたならできます!

読んでくださってありがとうございました。この記事を気に入ってくださったなら、たくさんの人の目に触れるようにclap(このブログにとっての「いいね!」)してください!

この記事にインスピレーションを受けた方は、感謝の印として私にコーヒーをおごってください。

Vaulty
Vaulty.io - 1つのリンクだけですべてのクリプトカレンシー(暗号通貨)を受け入れることができます
www.vaulty.io

さらなる情報を入手したい方は、私のtwitterをフォローしてください!

皆さんの興味をそそるかもしれない、私が執筆した記事は以下のとおりです:

初めてのBitcoinを購入する方法
免責事項#1:失っても構わないくらいの金額を投資してください!それ以上賭けるのはお勧めしません……
hackernoon.com

2017年にJavascriptを学ぶためのベストコース
Javascriptは、今のところ最も人気のあるプログラミング言語です。私たちは、Javascriptを使って静的なウェブサイト、ウェブアプリケーションを構築することができます……
codeburst.io

最高のフロントエンドのハッキングチートシート - すべてを1か所にまとめたもの
すべてのAPIを記憶しておくのは不可能です。チートシートに頼っちゃいましょう!最高のフロントエンドは……
medium.freecodecamp.org

ブロックチェーンとクリプトカレンシー(暗号通貨)の基本を理解する究極ガイド
ビットコインを説明しているものの、ほとんど理解していない陽気で風刺的な男を見ても恐怖を感じないでください。現在私たちは……
hackernoon.com

SwiftとiOSの開発をマスターするための究極のリソースリスト(2018年版)
Swiftは、AppleがiOS、macOS向けに開発した、汎用、マルチパラダイム、コンパイルされたプログラミング言語です……
medium.com

読んでくださってありがとうございます!

Indrek Lasn
2017年10月からMediumのメンバー
幸福の商人、https://vaulty.ioの創設者、www.covee.networkの成長/エンジニアリング



CREDIT:原著者の許諾のもと翻訳・掲載しています。

[原文]The secret to being a top developer is building things! Here’s a list of fun apps to build! (Posted Dec 1, 2017) by Indrek Lasn
 


関連する記事

人気の記事

スキルアップ記事トップへ

無料サポート登録簡単30秒

【厚生労働省】職業紹介事業許可番号(13-ユ-308734)

  • STEP1
  • STEP2
  • STEP3
  • 次のstepで入力すると返事が来る!
  • プロフィール入力すると返事が来る!
  • ご希望の条件を選択してください

    ご希望の勤務形態

    必須

    ご希望の勤務地

    任意

  • プロフィールをご入力ください!必須入力項目はこのページで終わりです。

    氏名

    必須

    氏名かな

    必須

    生年月日

    必須

    電話番号

    必須

    メールアドレス

    必須

  • スキルシート・ポートフォリオをお持ちの方はアップロードしてください

    スキルシート

    任意

    提出しておくことで
    迅速なご紹介が可能に!

    職務経歴書

    ドラッグアンドドロップ or ファイルを選択 選択されていません

    履歴書

    ドラッグアンドドロップ or ファイルを選択 選択されていません

    スキルシートを確認しています...

    スキルシートを確認しています...

    ※ファイルは5MB以下で対応するファイル形式 ? でアップロードしてください
    Microsoft Office .xls .xlsx .doc .docx .ppt .pptx
    KINGSOFT Office .xls .xlsx .doc .docx .ppt
    iWork .numbers .pages .key
    LibreOffice .ods .odt .odp
    OpenOffice .ods .odt .odp
    その他 .pdf

    ポートフォリオURL

    任意

    ?

    ポートフォリオとは主にクリエイターの方が自己PRのために過去の作品や制作実績をまとめた作品集の事です。

    ポートフォリオをWeb上で公開されている方はそのURLを、データでお持ちの方は作品データをアップしたURLを入力してください。

    ※データをアップされる場合は、保存期間や容量制限の少ないGoogleドライブを推奨しています。

    その他ご要望

    任意

  • 下記の内容をご確認いただき問題ないようでしたら、送信してください

    プロフィール入力すると返事が来る!

    • ご希望の勤務形態 必須

    • ご希望の勤務地 任意

      第一希望:
      第二希望:

    • 氏名 必須

    • 氏名かな 必須

    • 生年月日 必須

    • 電話番号 必須

    • メールアドレス 必須

    • 職務経歴書 任意

    • 履歴書 任意

    • ポートフォリオURL 任意

    • その他ご要望 任意

    個人情報の取り扱い 」と「 利用規約 」に同意の上、 『同意して登録する』 ボタンをクリックして下さい。

プライバシーマーク

レバテック株式会社は「プライバシーマーク」使用許諾事業者として認定されています。
個人情報の秘密は厳守します。ご入力いただいた情報は許可を頂くまで求人企業に公開することはありませんので、ご安心ください。

申し込みに関するご注意
以下の方は弊社の事業基盤、求人動向から、ご提案のご連絡までお時間をいただく可能性があります。ご了承ください。
IT業界、または希望職種が未経験の方
レバテックキャリア対象エリア以外での勤務地、また在宅での作業を希望される方