add react

greathongtu · Mar 14, 2024 · 44abdea · 44abdea
1 parent d2e84d2
commit 44abdea
Show file tree

Hide file tree

Showing 70 changed files with 7,207 additions and 232 deletions.
diff --git a/content/posts/react.md b/content/posts/react.md
@@ -0,0 +1,14 @@
++++
+title = 'React'
+date = 2024-03-14T19:42:12+08:00
+draft = false
+tags = ['frontend', 'react']
++++
+
+
+
+* jsx：component返回的jsx，看起来像html，实际是javascript，通过babel将jsx编译成javascript，这些js最后通过dom操作生产html。jsx融合了html，css，js三个。
+* props：是属性，是上级component向下级component传递的只读的信息
+* state：使用useState()返回一个初始值v和一个function setV。useState是一个react Hook。根据当前state更新新的state需要用lambda function
+* UI = 很多components = f(state)
+* Npx create-react-app@5 travel-list 运行：npm install; npm start
diff --git a/public/404.html b/public/404.html
@@ -25,6 +25,8 @@
 
 
 
+
+
 
 
 
@@ -33,7 +35,7 @@
   style="--bg: #faf8f1"
   lang="en-us"
 >
-  <head>
+  <head><script src="/livereload.js?mindelay=10&amp;v=2&amp;port=1313&amp;path=livereload" data-no-instant defer></script>
   <meta charset="utf-8" />
   <meta http-equiv="X-UA-Compatible" content="IE=edge" />
   <meta
@@ -42,7 +44,7 @@
   />
 
 
-  <title>404 Page not found - My New Hugo Site</title>
+  <title>404 Page not found - greathongtu 的 Blog</title>
 
 
   <meta name="theme-color" />
@@ -56,7 +58,7 @@
     name="description"
     content="A personal blog"
   />
-  <meta name="author" content="My New Hugo Site" />
+  <meta name="author" content="greathongtu 的 Blog" />
 
 
 
@@ -65,14 +67,14 @@
 
 
 
-  <link rel="preload stylesheet" as="style" href="https://example.org/main.min.css" />
+  <link rel="preload stylesheet" as="style" href="http://localhost:1313/main.min.css" />
 
 
 
 
 
 
-  <link rel="preload" as="image" href="https://example.org/theme.png" />
+  <link rel="preload" as="image" href="http://localhost:1313/theme.png" />
 
 
 
@@ -82,46 +84,26 @@
 
 
 
-
-
-
-
-
-
+  <link rel="preload" as="image" href="http://localhost:1313/github.svg" />
 
 
 
 
-  <link rel="icon" href="https://example.org/favicon.ico" />
-  <link rel="apple-touch-icon" href="https://example.org/apple-touch-icon.png" />
-
 
-  <meta name="generator" content="Hugo 0.120.1">
 
 
 
 
-
-
-  <meta itemprop="name" content="404 Page not found">
-<meta itemprop="description" content="">
-
-  <meta property="og:title" content="404 Page not found" />
-<meta property="og:description" content="" />
-<meta property="og:type" content="website" />
-<meta property="og:url" content="https://example.org/404.html" />
-
 
 
-  <meta name="twitter:card" content="summary"/>
-<meta name="twitter:title" content="404 Page not found"/>
-<meta name="twitter:description" content=""/>
+  <link rel="icon" href="http://localhost:1313/favicon.ico" />
+  <link rel="apple-touch-icon" href="http://localhost:1313/apple-touch-icon.png" />
 
 
+  <meta name="generator" content="Hugo 0.123.8">
+
 
 
-  <link rel="canonical" href="https://example.org/404.html" />
-
 
 </head>
 
@@ -130,8 +112,8 @@
   <div class="relative z-50 mr-auto flex items-center">
     <a
       class="-translate-x-[1px] -translate-y-[1px] text-2xl font-semibold"
-      href="https://example.org/"
-      >My New Hugo Site</a
+      href="http://localhost:1313/"
+      >greathongtu 的 Blog</a
     >
     <div
       class="btn-dark text-[0] ml-4 h-6 w-6 shrink-0 cursor-pointer [background:url(./theme.png)_left_center/_auto_theme('spacing.6')_no-repeat] [transition:_background-position_0.4s_steps(5)] dark:[background-position:right]"
@@ -198,6 +180,22 @@
 
 
 
+    <nav
+      class="mt-12 flex justify-center space-x-10 dark:invert lg:ml-12 lg:mt-0 lg:items-center lg:space-x-6"
+    >
+
+      <a
+        class="h-8 w-8 text-[0] [background:var(--url)_center_center/cover_no-repeat] lg:h-6 lg:w-6"
+        style="--url: url(./github.svg)"
+        href="https://github.com/greathongtu"
+        target="_blank"
+        rel="me"
+      >
+        github
+      </a>
+
+    </nav>
+
   </div>
 </header>
 
@@ -218,8 +216,8 @@
   class="opaco mx-auto flex h-[4.5rem] max-w-3xl items-center px-8 text-[0.9em] opacity-60"
 >
   <div class="mr-auto">
-    &copy; 2023
-    <a class="link" href="https://example.org/">My New Hugo Site</a>
+    &copy; 2024
+    <a class="link" href="http://localhost:1313/">greathongtu 的 Blog</a>
   </div>
   <a class="link mx-6" href="https://gohugo.io/" rel="noopener" target="_blank"
     >Powered by Hugo️️</a

diff --git a/public/images/c-function-call-stack.png b/public/images/c-function-call-stack.png
diff --git a/public/images/c-function-call-stack.png:Zone.Identifier b/public/images/c-function-call-stack.png:Zone.Identifier
diff --git a/public/images/go-hashmap-hashgrow.png b/public/images/go-hashmap-hashgrow.png
diff --git a/public/images/go-hashmap-hashgrow.png:Zone.Identifier b/public/images/go-hashmap-hashgrow.png:Zone.Identifier
diff --git a/public/images/go-hashmap-mapaccess.png b/public/images/go-hashmap-mapaccess.png
diff --git a/public/images/go-hashmap-mapaccess.png:Zone.Identifier b/public/images/go-hashmap-mapaccess.png:Zone.Identifier
diff --git a/public/images/go-hashmap-overflow-bucket.png b/public/images/go-hashmap-overflow-bucket.png
diff --git a/public/images/go-hashmap-overflow-bucket.png:Zone.Identifier b/public/images/go-hashmap-overflow-bucket.png:Zone.Identifier
diff --git a/public/images/go-map.png b/public/images/go-map.png
diff --git a/public/images/go-map.png:Zone.Identifier b/public/images/go-map.png:Zone.Identifier
diff --git a/public/images/go-slice-copy.png b/public/images/go-slice-copy.png
diff --git a/public/images/go-slice-copy.png:Zone.Identifier b/public/images/go-slice-copy.png:Zone.Identifier
@@ -0,0 +1,4 @@
+[ZoneTransfer]
+ZoneId=3
+ReferrerUrl=https://draveness.me/
+HostUrl=https://img.draveness.me/2019-02-20-golang-slice-copy.png
diff --git a/public/images/go-string-concat-and-copy.png b/public/images/go-string-concat-and-copy.png
diff --git a/public/images/go-string-concat-and-copy.png:Zone.Identifier b/public/images/go-string-concat-and-copy.png:Zone.Identifier
diff --git a/public/images/golang-function-call-stack-before-calling.png b/public/images/golang-function-call-stack-before-calling.png
diff --git a/public/images/golang-function-call-stack-before-calling.png:Zone.Identifier b/public/images/golang-function-call-stack-before-calling.png:Zone.Identifier
diff --git a/public/images/golang-slice-struct.png b/public/images/golang-slice-struct.png