iT邦幫忙

鐵人檔案

第 12 屆 iT 邦幫忙鐵人賽
回列表
Modern Web

我不用Expo啦,React Native! 系列

身為一個自認為React為主力卻是以Vue在工作的新手前端工程師,最近開始學習使用TypeScript,想要找個目標練習,同時又想起了當初學軟體的初心:寫App。剛好自己也沒認真學過React Native,於是想把使用TS+RN從頭開始開發App的過程記錄下來,看看能走到多遠。
這系列不定位為教學文,而是新手從零開始的紀錄文。

鐵人鍊成 | 共 33 篇文章 | 20 人訂閱 訂閱系列文 RSS系列文
DAY 1

[Day1] React Native是什麼?

自我介紹一下 首先來介紹一下參賽動機,小弟公務員做了三四年後覺得工作沒什麼樂趣,自己又突然想來學一下App,於是辭職後開始尋找相關資訊,開頭遇上了不少狀況 要...

2020-09-01 ‧ 由 b97201019 分享
DAY 2

[Day2] React Native入門可以不用Expo嗎?

Expo是什麼? 雖然系列名字有個Expo,但Expo大概只會出現在這一篇吧 Expo算是React Native中的框架(?),能使網頁開發人員不需接觸原生的...

2020-09-02 ‧ 由 b97201019 分享
DAY 3

[Day3] 創建專案的時間到啦

這個專案決定給自己高一點的標準,使用TypeScript+Eslint的Airbnb規範 TypeScript是什麼 TypeScript是將JavaScrip...

2020-09-03 ‧ 由 b97201019 分享
DAY 4

[Day4] 加入導覽列-Android:你再冷落我試試看啊?

今日關鍵字:Navigation 首先先看到最外層的App.tsx這支檔案 import React from 'react'; import { Saf...

2020-09-04 ‧ 由 b97201019 分享
DAY 5

[Day5] 在導覽列加入圖示

今日關鍵字:vector icon 接續昨天 參考Tab navigation的Customizing the appearance import Ionic...

2020-09-05 ‧ 由 b97201019 分享
DAY 6

[Day6] 訂定資料格式-TypeScript:型別判斷

今日關鍵字:TypeScript 接續昨天icon尚未設定完成 先自定一個對應各個畫面的陣列 const routes = [ { name: '...

2020-09-06 ‧ 由 b97201019 分享
DAY 7

[Day7] 訂定資料格式-2

今日關鍵字:interface 建立動畫格式 延續昨天的interface 首先幫我的動畫資料訂定格式 這時如果要設定一個動畫陣列 [Anime1 ,Ani...

2020-09-07 ‧ 由 b97201019 分享
DAY 8

[Day8] 輪播:神奇的上下交錯

今日關鍵字:carousel 接續昨天把資料整理好了 今天要把資料呈現在畫面上 (不過這裡我想的輪播其實跟一般的輪播不同,沒有要自動播放 總之先來找找看)...

2020-09-08 ‧ 由 b97201019 分享
DAY 9

[Day9] Redux:我是大家的無人機

今日關鍵字:無人...Redux 假如有一天,你在家煮了咖哩 不小心煮了太多 想分給對面的人 如果是以前都是平房時 直接走過去就好 如果場景變換成現代 你住...

2020-09-09 ‧ 由 b97201019 分享
DAY 10

[Day10] 建立與細節頁面之連結

今日關鍵字:stack navigation 現在想要在首頁上點擊輪播中的其中一個動畫時就跳到其細節頁面 該怎麼做呢?這時候又需要Navigation了 不過...

2020-09-10 ‧ 由 b97201019 分享