diff --git a/Home.md b/Home.md
index e69de29..24c7dce 100644
--- a/Home.md
+++ b/Home.md
@@ -0,0 +1,17 @@
+# Home
+
+Component list of this Pokedex application
+
+* **Pokemon Card**: Each pokemon card should display simple information of the pokemon, which include
+  * Card Header
+    * Number
+    * a info icon to open detailed info
+  * Image
+  * Name
+  * Pokemon Type
+* **Filter**: Filter component contains following filter options
+  * Region
+  * Type
+  * Sort By
+  * Search
+* **Pokedex**: Combination of Filter and an array of Pokemon Card, as Filter can determines what Pokemon card are show on the list
diff --git a/Log.md b/Log.md
new file mode 100644
index 0000000..8b79238
--- /dev/null
+++ b/Log.md
@@ -0,0 +1,67 @@
+# Log
+
+## 2023-03
+
+What I did:
+* Set up project
+
+What I learned:
+* configuring project correctly benefits quite a lot in long run
+  * prettier & eslint
+  * husky for pre-commit check
+  * Storybook
+
+## 2023-04-06
+
+What I did:
+
+* Move initialization of `RegionPokemonIdRange` and `sortOptions` into pokedexSlice. Removed unnecessary `useEffect` for initialization in Filter component
+
+```
+I apologize for the confusion earlier. I have reviewed the code again, and I believe the issue is related to the fact that the useEffect hook is running after the initial render of the component. In this case, since the component is only rendered once, the useEffect hook is triggered once, causing an additional pair of setSortList and setRegionPokemonIdsList actions to be dispatched.
+```
+
+* Removed complicated handleChangexxx, and dispatch event directly into onChange property
+
+What I learned:
+* If we use Redux in our application, then we probably want to design our FE as data oriented. So react component focus on rendering and visual effect, redux slice/state focus on data manipulation.
+  * Data initialization should not started within React component
+
+## 2023-04-17
+
+What I did:
+* Transformed over complicated Pokemon in pokedexSlice to PokemonCard, to save state footprint
+* Implemented search bar
+* Implemented framer-motion
+
+What I learned:
+* javascript `fetch()` will not leave cache. Hence, I don't need manually clear cache after fetching
+* To lazy load image, react-lazy-load-image-component is a good way
+* Standard search bar is quite easy to implement given Github Copilot
+* Framer-motion is hard to decide and justify. AI cannot replace decision maker (designer are safe, not our developer)
+
+```
+npm i --save-dev @types/react-lazy-load-image-component
+```
+
+## 2023-05-07
+
+What I did:
+* Move PokemonCard out out Pokedex feature into `component` directory.
+* Move Filter and related state control out of Pokedex feature, so it become a individual slice
+  * Benefit: more concentrated logic; Pokedex don't need rtk api anymore.
+* Move api into `/service` directory, as RTK Query should put all related endpoints together
+
+What I learned:
+* Storybook is a fantastic tool to drive development cycle.
+  * We will try out best to containerize small component into pure React component
+  * A feature component = feature/slice + react component; If create storybook for the feature is too complicated, then there is something wrong
+
+## 2023-05-17
+
+What I did:
+* Finished InfoDialog feature: closing & opening
+
+What I learned:
+* How to use createAsyncThunk in slice
+* How to properly use RTK Query endpoints in Async Thunk
\ No newline at end of file
diff --git a/Todo.md b/Todo.md
new file mode 100644
index 0000000..e85276d
--- /dev/null
+++ b/Todo.md
@@ -0,0 +1,41 @@
+# TodoList
+
+Plans of implementing Pokedex application
+
+* [ ] Implement single Pokemon Card
+  * [x] Accept Props `{number, Image, Name, Pokemon Type}`
+  * [x] Display number
+  * [x] Display Image
+  * [x] Display Name
+  * [x] Display Pokemon Type
+  * [x] Display background color according to Type
+  * [x] Use correct CSS 
+  * [x] Check in Storybook
+* [ ] Implement Filter row
+  * [ ] Implement Region filter
+    * [x] Get region list to choose
+    * [ ] Implement dispatching redux action to get list of Pokemon in pokedex
+  * [ ] Implement Type filter
+    * [x] Get type list to choose
+    * [x] Add All type to the list
+  * [ ] Implement Sort By filter
+    * [x] Get sort options
+    * [ ] Implement dispatching redux action to limit list of Pokemon card
+  * [ ] Implement Search bar (name)
+    * [ ] Implement dispatching redux action to limit list of Pokemon card in pokedex via name
+  * [ ] Use correct CSS
+  * [ ] Check in Storybook
+* [ ] Implement pokedex to include both Filter and a list of Pokemon Card
+* [ ] Implement Pokedex Header:
+  * [ ] Implement a day/night option
+  * [ ] Add Header image
+  * [ ] Check in Storybook
+
+Logic of the app:
+1. When the app is first loaded, filter should load data about available regions, types, and sort by options
+   1. Default value 
+      1. Region: first one in the region list
+      2. Type: all types
+      3. Sort By: ID
+2. After loaded filter bar, pokedex should load all Pokemon Cards according to default filter bar
+3. When you are loading Pokemon, the loading scene should play
\ No newline at end of file