iT邦幫忙

鐵人檔案

第 12 屆 iThome 鐵人賽
回列表
Modern Web

我不用Expo啦,React Native! 系列

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

鐵人鍊成 | 共 33 篇文章 | 65 人訂閱 訂閱系列文 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 Ionico...

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

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

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

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

[Day7] 訂定資料格式-2

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

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 分享