Skip to content

Commit ebadfd1

Browse files
davidhu2000davidhu2000
authored
feat: update about info and technologies, update astro-icon to latest (#355)
1 parent 9723d44 commit ebadfd1

File tree

8 files changed

+526
-340
lines changed

8 files changed

+526
-340
lines changed

‎astro.config.mjs

+3-1
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,8 @@ import rehypePrettyCode from "rehype-pretty-code";
77

88
import { remarkReadingTime } from "./plugins/remark-reading-time.mjs";
99

10+
import icon from "astro-icon";
11+
1012
/** @type {import('rehype-pretty-code').Options} */
1113
const options = {
1214
// theme: {
@@ -35,7 +37,7 @@ const options = {
3537
// https://astro.build/config
3638
export default defineConfig({
3739
site: "https://www.davidhu.io",
38-
integrations: [mdx(), sitemap(), tailwind(), prefetch()],
40+
integrations: [mdx(), sitemap(), tailwind(), prefetch(), icon()],
3941
markdown: {
4042
syntaxHighlight: false,
4143
// TODO: this plugin does not work for mdx files, need to figure out why

‎package.json

+6-5
Original file line numberDiff line numberDiff line change
@@ -16,20 +16,21 @@
1616
"@astrojs/rss": "4.0.11",
1717
"@astrojs/sitemap": "3.3.0",
1818
"@astrojs/tailwind": "6.0.2",
19+
"@iconify-json/fa-brands": "^1.2.1",
20+
"@iconify-json/mdi": "^1.2.3",
21+
"@iconify-json/simple-icons": "^1.2.32",
1922
"@tailwindcss/typography": "^0.5.10",
2023
"astro": "5.6.2",
21-
"astro-icon": "^0.8.1",
24+
"astro-icon": "^1.1.5",
2225
"cypress": "^14.3.0",
2326
"mdast-util-to-string": "^4.0.0",
2427
"prettier": "^3.5.3",
2528
"reading-time": "^1.5.0",
2629
"rehype-pretty-code": "^0.14.1",
2730
"sharp": "^0.34.1",
31+
"shiki": "^3.2.2",
2832
"tailwindcss": "^3.4.17",
2933
"typescript": "^5.8.3"
3034
},
31-
"packageManager": "yarn@3.6.3",
32-
"dependencies": {
33-
"shiki": "^3.2.2"
34-
}
35+
"packageManager": "yarn@3.6.3"
3536
}

‎src/components/Footer.astro

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
---
2-
import { Icon } from "astro-icon";
2+
import { Icon } from "astro-icon/components";
33
44
import { socialLinks } from "../data/socialLinks";
55

‎src/components/Technologies.astro

+16-16
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,22 @@
11
---
2-
import { Icon } from "astro-icon";
2+
import { Icon } from "astro-icon/components";
33
44
const items = [
5+
{
6+
title: "Google Cloud",
7+
icon: "mdi:google-cloud",
8+
},
59
{
610
title: "Amazon Web Services",
711
icon: "fa-brands:aws",
812
},
913
{
10-
title: "Bash Scripting",
11-
icon: "logos:bash-icon",
14+
title: "Kubernetes",
15+
icon: "mdi:kubernetes",
1216
},
1317
{
14-
title: "Cypress",
15-
icon: "simple-icons:cypress",
18+
title: "Terraform",
19+
icon: "mdi:terraform",
1620
},
1721
{
1822
title: "Git",
@@ -22,10 +26,6 @@ const items = [
2226
title: "GitHub",
2327
icon: "fa-brands:github",
2428
},
25-
{
26-
title: "Kubernetes",
27-
icon: "mdi:kubernetes",
28-
},
2929
{
3030
title: "NodeJS",
3131
icon: "mdi:nodejs",
@@ -35,20 +35,20 @@ const items = [
3535
icon: "fa-brands:react",
3636
},
3737
{
38-
title: "Ruby on Rails",
39-
icon: "mdi:language-ruby-on-rails",
38+
title: "Typescript",
39+
icon: "mdi:language-typescript",
4040
},
4141
{
42-
title: "Terraform",
43-
icon: "mdi:terraform",
42+
title: "Python",
43+
icon: "mdi:language-python",
4444
},
4545
{
46-
title: "Typescript",
47-
icon: "mdi:language-typescript",
46+
title: "NeoVim",
47+
icon: "simple-icons:neovim",
4848
},
4949
{
5050
title: "VS Code",
51-
icon: "akar-icons:vscode-fill",
51+
icon: "mdi:vs-code",
5252
},
5353
];
5454
---

‎src/pages/about.astro

+40-17
Original file line numberDiff line numberDiff line change
@@ -1,38 +1,52 @@
11
---
2-
import { Icon } from "astro-icon";
3-
import { Image } from 'astro:assets'
2+
import { Icon } from "astro-icon/components";
3+
import { Image } from "astro:assets";
44
import Technologies from "../components/Technologies.astro";
55
import IconLoading from "../components/icons/IconLoading.astro";
66
import PageLayout from "../layouts/PageLayout.astro";
7-
import myImage from "../assets/main/me.webp"
7+
import myImage from "../assets/main/me.webp";
88
99
const canonical = new URL(`about`, Astro.site);
1010
1111
const title = "About David Hu";
1212
const description = "Sometimes I write code. Other times, I write code with coffee.";
1313
1414
const steps = [
15+
{
16+
icon: "mdi:company",
17+
name: "Co-founder & CTO @ Magic Hour",
18+
content: "Building AI Video & Image Creation Platform",
19+
content2: "Still doing full stack work, now just without needing to write unit tests.",
20+
link: "https://magichour.ai",
21+
linkText: "Magic Hour",
22+
},
1523
{
1624
icon: "mdi:work",
1725
name: "Lead Full Stack Engineer",
1826
content: "Maker of full stack apps. Fan of infrastructure as code. Builder of CI/CD pipelines.",
1927
content2:
2028
"My favorite part of the role is the variety, going from frontend one day, to backend the next day, then infrastructure and cost optimizations. I like it all!",
29+
link: "https://github.com/davidhu2000",
30+
linkText: "My Github Profile",
2131
},
2232
{
23-
icon: "ri:open-source-fill",
33+
icon: "mdi:open-source-initiative",
2434
name: "Open Source",
2535
content:
26-
"I maintain an NPM package titled 'React Spinners', a set of loading components. Go check it out at /react-spinners. 15 million downloads and counting 🙂",
27-
},
28-
{
29-
icon: "simple-icons:stackoverflow",
30-
name: "Stack Overflow",
31-
content:
32-
"I'm not sure I can write code without this website. I tried to contribute whenever I can. My goal is to reach 10,000 reputations by end of this year.",
36+
"I maintain an NPM package titled 'React Spinners', a set of loading components. 28 million downloads and counting 🙂",
37+
link: "https://www.davidhu.io/react-spinners",
38+
linkText: "React Spinners Demo",
3339
},
40+
// {
41+
// icon: "mdi:stackoverflow",
42+
// name: "Stack Overflow",
43+
// content:
44+
// "I'm not sure I can write code without this website. I tried to contribute whenever I can. My goal is to reach 10,000 reputations by end of this year.",
45+
// link: "https://stackoverflow.com/users/6496010/davidhu",
46+
// linkText: "My StackOverflow Profile",
47+
// },
3448
{
35-
icon: "cil:mood-very-good",
49+
icon: "mdi:mood",
3650
name: "Thank you for reading!",
3751
},
3852
];
@@ -74,12 +88,21 @@ const steps = [
7488
</div>
7589
{step.content && <div class="w-px h-full bg-gray-300 dark:bg-slate-500" />}
7690
</div>
77-
<div class="pt-1 pb-8">
78-
<p class="mb-2 text-xl font-bold text-gray-900 dark:text-slate-300">
79-
{step.name}
80-
</p>
81-
<p class="mb-2">{step.content}</p>
91+
<div class="pt-1 pb-8 flex flex-col gap-2">
92+
<p class=" text-xl font-bold text-gray-900 dark:text-slate-300">{step.name}</p>
93+
<p class="">{step.content}</p>
8294
<p>{step.content2}</p>
95+
96+
{step.link && (
97+
<a
98+
href={step.link}
99+
class="font-medium text-blue-600 dark:text-blue-500 flex items-center gap-1"
100+
target="_blank"
101+
>
102+
{step.linkText}
103+
<Icon name="mdi:external-link" />
104+
</a>
105+
)}
83106
</div>
84107
</div>
85108
))

‎src/pages/contact.astro

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
---
2-
import Icon from "astro-icon";
2+
import { Icon } from "astro-icon/components";
33
44
import { socialLinks } from "../data/socialLinks";
55
import PageLayout from "../layouts/PageLayout.astro";

‎src/pages/projects.astro

+9-9
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
11
---
2-
import Icon from "astro-icon";
2+
import { Icon } from "astro-icon/components";
33
44
import PageLayout from "../layouts/PageLayout.astro";
55
import { Image } from "astro:assets";
6-
import reactSpinnersImage from "../assets/main/project-react-spinners.png"
7-
import kubeKnotsDarkImage from "../assets/main/project-kube-knots-dark.png"
8-
import kubeKnotsLightImage from "../assets/main/project-kube-knots-light.png"
6+
import reactSpinnersImage from "../assets/main/project-react-spinners.png";
7+
import kubeKnotsDarkImage from "../assets/main/project-kube-knots-dark.png";
8+
import kubeKnotsLightImage from "../assets/main/project-kube-knots-light.png";
99
1010
const canonical = new URL(`projects`, Astro.site);
1111
@@ -63,12 +63,12 @@ const kubeKnots = await fetch("https://api.github.com/repos/davidhu2000/kube-kno
6363
<div class="flex mt-4">
6464
<div class="flex-shrink-0">
6565
<div class="flex items-center justify-center h-6">
66-
<Icon name="ic:outline-highlight" class="w-5 h-5" />
66+
<Icon name="mdi:sparkles-outline" class="w-5 h-5" />
6767
</div>
6868
</div>
6969
<div class="ml-4">
7070
<h3 class="font-medium dark:text-white leading-6 text-lg">Highlights</h3>
71-
<p class="text-muted mt-2">&gt;20 million downloads</p>
71+
<p class="text-muted mt-2">&gt;28 million downloads</p>
7272
<p class="text-muted mt-2">{reactSpinners.stargazers_count} stars on github</p>
7373
<p class="text-muted mt-2">used by &gt;100000 repositories</p>
7474
</div>
@@ -77,7 +77,7 @@ const kubeKnots = await fetch("https://api.github.com/repos/davidhu2000/kube-kno
7777
<div class="flex mt-4">
7878
<div class="flex-shrink-0">
7979
<div class="flex items-center justify-center h-6">
80-
<Icon name="ic:baseline-open-in-new" class="w-5 h-5" />
80+
<Icon name="mdi:external-link" class="w-5 h-5" />
8181
</div>
8282
</div>
8383
<div class="ml-4">
@@ -151,7 +151,7 @@ const kubeKnots = await fetch("https://api.github.com/repos/davidhu2000/kube-kno
151151
<div class="flex mt-4">
152152
<div class="flex-shrink-0">
153153
<div class="flex items-center justify-center h-6">
154-
<Icon name="ic:outline-highlight" class="w-5 h-5" />
154+
<Icon name="mdi:sparkles-outline" class="w-5 h-5" />
155155
</div>
156156
</div>
157157
<div class="ml-4">
@@ -164,7 +164,7 @@ const kubeKnots = await fetch("https://api.github.com/repos/davidhu2000/kube-kno
164164
<div class="flex mt-4">
165165
<div class="flex-shrink-0">
166166
<div class="flex items-center justify-center h-6">
167-
<Icon name="ic:baseline-open-in-new" class="w-5 h-5" />
167+
<Icon name="mdi:external-link" class="w-5 h-5" />
168168
</div>
169169
</div>
170170
<div class="ml-4">

0 commit comments

Comments
 (0)