diff --git a/public/favicon.png b/public/favicon.png deleted file mode 100644 index 9ddf0d6..0000000 Binary files a/public/favicon.png and /dev/null differ diff --git a/public/favicon.svg b/public/favicon.svg deleted file mode 100644 index 3b58072..0000000 --- a/public/favicon.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - \ No newline at end of file diff --git a/public/logo-dark.png b/public/logo-dark.png deleted file mode 100644 index e0380fd..0000000 Binary files a/public/logo-dark.png and /dev/null differ diff --git a/public/logo-light.png b/public/logo-light.png deleted file mode 100644 index eb573a1..0000000 Binary files a/public/logo-light.png and /dev/null differ diff --git a/public/og.png b/public/og.png new file mode 100644 index 0000000..c71ca40 Binary files /dev/null and b/public/og.png differ diff --git a/src/app.css b/src/app.css index 0177409..e7dc5b0 100644 --- a/src/app.css +++ b/src/app.css @@ -1,6 +1,4 @@ @import url("https://fonts.cdnfonts.com/css/jetbrains-mono-2"); -@import "tailwindcss"; - @config "../tailwind.config.ts"; .tree, @@ -45,3 +43,5 @@ height: calc(var(--line-height) / 2); border-left: var(--border-thickness) solid var(--text-color); } + +@import "tailwindcss"; diff --git a/src/app.tsx b/src/app.tsx index fb65904..0e409b2 100644 --- a/src/app.tsx +++ b/src/app.tsx @@ -1,27 +1,20 @@ import { Router } from "@solidjs/router"; import { FileRoutes } from "@solidjs/start/router"; -import { createSignal, onCleanup, onMount, Suspense } from "solid-js"; +import { Suspense } from "solid-js"; import "./app.css"; import { Layout } from "./components/Layout"; -import { MetaProvider, Title } from "@solidjs/meta"; +import { MetaProvider, Title, Meta } from "@solidjs/meta"; export default function App() { - onMount(() => { - const listener = (e: KeyboardEvent) => { - if (e.metaKey && e.key.toLowerCase() === "k") { - e.preventDefault(); // Prevent the default action (optional) - document.body.classList.toggle("debug"); - } - }; - window.addEventListener("keydown", listener); - onCleanup(() => { - window.removeEventListener("keydown", listener); - }); - }); - return ( - minhtrannhat.com + minhtran_dev + + + + + + { return ( diff --git a/src/components/Experience.jsx b/src/components/Experience.jsx index 971e862..cb33ce2 100644 --- a/src/components/Experience.jsx +++ b/src/components/Experience.jsx @@ -3,13 +3,13 @@ import JobCard from "./JobCard"; import { createSignal } from "solid-js"; const Experience = () => { - const [jobs, setJobs] = createSignal([ + const [jobs, _] = createSignal([ { title: "Software Developer Engineer Intern", company: "Amazon (Delivery Extensions Team)", location: "Toronto, Ontario, Canada", range: "May 2025 - July 2025", - url: "", + url: "https://amazon.jobs/content/en/teams/ftr", }, { title: "Software Engineer Intern", @@ -21,9 +21,10 @@ const Experience = () => { ]); return ( -
-

Experience

-
+
+

Experience

+ +
{(job) => }
diff --git a/src/components/JobCard.jsx b/src/components/JobCard.jsx index 938900d..24e65c7 100644 --- a/src/components/JobCard.jsx +++ b/src/components/JobCard.jsx @@ -1,13 +1,13 @@ const JobCard = (props) => { return ( -
+

{props.job.title} @ {props.job.company}

-

+

{props.job.range} | {props.job.location}

diff --git a/src/components/Layout.tsx b/src/components/Layout.tsx index 82681e3..a01e2c9 100644 --- a/src/components/Layout.tsx +++ b/src/components/Layout.tsx @@ -22,17 +22,22 @@ export const Layout: ParentComponent = (props) => {
- ~/minhtrannhat + ~/minh
diff --git a/src/components/Markdown.tsx b/src/components/Markdown.tsx index 15f977b..90b4428 100644 --- a/src/components/Markdown.tsx +++ b/src/components/Markdown.tsx @@ -42,7 +42,7 @@ const Pre: ParentComponent<{ lang: string; lines?: string; file?: string }> = ( return (
-
+
}> {props.file} @@ -186,9 +186,9 @@ export const PostImage: Component<{ ); }; -export const Aside: ParentComponent = (props) => ( +export const Notes: ParentComponent = (props) => ( ); diff --git a/src/css/prism-nord.css b/src/css/prism-nord.css new file mode 100644 index 0000000..404db10 --- /dev/null +++ b/src/css/prism-nord.css @@ -0,0 +1,136 @@ +/* Generated with http://k88hudson.github.io/syntax-highlighting-theme-generator/www */ + +/********************************************************* + * General + */ +pre[class*="language-"], +code[class*="language-"] { + color: #d8dee9; + font-size: 1em; + text-shadow: none; + font-family: Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace; + direction: ltr; + text-align: left; + white-space: pre; + word-spacing: normal; + word-break: normal; + line-height: 1.5; + -moz-tab-size: 4; + -o-tab-size: 4; + tab-size: 4; + -webkit-hyphens: none; + -moz-hyphens: none; + -ms-hyphens: none; + hyphens: none; +} +pre[class*="language-"]::selection, +code[class*="language-"]::selection, +pre[class*="language-"]::mozselection, +code[class*="language-"]::mozselection { + text-shadow: none; + background: none; +} +@media print { + pre[class*="language-"], + code[class*="language-"] { + text-shadow: none; + } +} +pre[class*="language-"] { + padding: 1em; + margin: .5em 0; + overflow: auto; + background: #2e3440; +} +:not(pre) > code[class*="language-"] { + padding: .1em; + border-radius: .3em; + color: #d8dee9; + background: #2e3440; +} +/********************************************************* + * Tokens + */ +.namespace { + opacity: 0.7; +} +.token.comment, +.token.prolog, +.token.doctype, +.token.cdata { + color: #606e87; +} +.token.punctuation { + color: #81a1c1; +} +.token.property, +.token.tag, +.token.boolean, +.token.number, +.token.constant, +.token.symbol, +.token.deleted { + color: #b48ead; +} +.token.selector, +.token.attr-name, +.token.string, +.token.char, +.token.builtin, +.token.inserted { + color: #a2bf8c; +} +.token.operator, +.token.entity, +.token.url, +.language-css .token.string, +.style .token.string { + color: #80a2c1; + background: none; +} +.token.atrule, +.token.attr-value, +.token.keyword { + color: #81a1c1; +} +.token.function { + color: #8fbcbc; +} +.token.regex, +.token.important, +.token.variable { + color: #ee9900; +} +.token.important, +.token.bold { + font-weight: bold; +} +.token.italic { + font-style: italic; +} +.token.entity { + cursor: help; +} +/********************************************************* + * Line highlighting + */ +pre[data-line] { + position: relative; +} +pre[class*="language-"] > code[class*="language-"] { + position: relative; + z-index: 1; +} +.line-highlight { + position: absolute; + left: 0; + right: 0; + padding: inherit 0; + margin-top: 1em; + background: #3b4251; + box-shadow: inset 5px 0 0 #d8dee9; + z-index: 0; + pointer-events: none; + line-height: inherit; + white-space: pre; +} diff --git a/src/data/posts.json b/src/data/posts.json index fe51488..934d568 100644 --- a/src/data/posts.json +++ b/src/data/posts.json @@ -1 +1,11 @@ -[] +[ + { + "title": "Testing Test Test Test", + "description": "Woah this is so cool", + "date": "2025-1-29", + "featuredImage": null, + "featuredImageDesc": null, + "tags": ["rust", "python", "mdx", "markdown"], + "slug": "test" + } +] diff --git a/src/drafts/solid-start-enumerate-routes.mdx b/src/drafts/solid-start-enumerate-routes.mdx deleted file mode 100644 index 8831ca7..0000000 --- a/src/drafts/solid-start-enumerate-routes.mdx +++ /dev/null @@ -1,48 +0,0 @@ ---- -date: 20204-05-11 -tags: - - solidjs - - webdev -title: How to enumerate routes in solid-start ---- - -This website is built with [solid-start](https://start.solidjs.com/getting-started/what-is-solidstart). - -I needed a way to enumerate all of the posts under `/blog` so that I could dynamically generate lists, both for the [home page](/), and for the tags pages: [/tags/solidjs](/tags/solidjs). - -However, the solid-start `` doesn't expose any of that information, either at build-time or run-time. We have to figure it out ourselves. - -My first thought was to have a script that watches the directory and writes to a file. - -That would've worked. But while browsing through the docs trying to figure out how to get a file watcher to be part of the vite dev server, I found out about [virtual modules](https://vitejs.dev/guide/api-plugin#virtual-modules-convention). - -Essentially, you can define a `js` module that has dynamic content by exporting a `js` string. - -```js lang="js" lines="2,14" -export default function myPlugin() { - const virtualModuleId = 'virtual:my-module' - const resolvedVirtualModuleId = '\0' + virtualModuleId - - return { - name: 'my-plugin', // required, will show up in warnings and errors - resolveId(id) { - if (id === virtualModuleId) { - return resolvedVirtualModuleId - } - }, - load(id) { - if (id === resolvedVirtualModuleId) { - return `export const msg = "from virtual module"` - } - }, - } -} -``` - -After adding `myPlugin` to your vite plugins list, you can import the virtual module anywhere in the code and use it as if it were a real file. - -```js lang="js" -import {msg} from "virtual:my-module" -``` - -This seemed more "elegant" than a file watcher. \ No newline at end of file diff --git a/src/drafts/this-blog-uses-solid-start.mdx b/src/drafts/this-blog-uses-solid-start.mdx deleted file mode 100644 index e92f0c2..0000000 --- a/src/drafts/this-blog-uses-solid-start.mdx +++ /dev/null @@ -1,34 +0,0 @@ ---- -date: 20204-05-11 -tags: - - solidjs - - webdev -title: This blog uses solid-start. -description: How to set up a blog using solid-start and mdx. ---- - -This website uses [solid-start](https://start.solidjs.com/getting-started/what-is-solidstart). - -solid-start is a Next.js-like framework for creating SSR / SSG websites. But instead of react, it builds on top of solid-js. - -I've been using solid and solid-start professionally for almost 2 years. And while solid-js feels rock-solid, solid-start still feels rough around the edges. - - -For each of the features I wanted to implement, I ran into issues that delayed this from being a weekend project into taking about 4 weekends instead. - -Here's what I wanted to accomplish: -1. Use [mdx](https://mdxjs.com/) for writing the posts -2. Define metadata for each post in the same mdx file -3. Full SSG -4. Code highlighting at compile time -5. Tags - -And here's how I did it: - -## Using mdx - -MDX is markdown that you can intersprinkle with jsx. - -The initial scaffolding is easy, follow [these steps](https://docs.solidjs.com/solid-start/getting-started), and choose the `with-mdx` option. - -I opted to have my posts live under the `/blog` path. diff --git a/src/global.d.ts b/src/global.d.ts deleted file mode 100644 index dc6f10c..0000000 --- a/src/global.d.ts +++ /dev/null @@ -1 +0,0 @@ -/// diff --git a/src/jobs/cisco.md b/src/jobs/cisco.md deleted file mode 100644 index 3b1bb53..0000000 --- a/src/jobs/cisco.md +++ /dev/null @@ -1,14 +0,0 @@ ---- -date: 2022-12-27 -title: Software Engineer Intern -company: Cisco Systems -location: Remote -range: January - May 2023 -url: https://www.cisco.com/c/en/us/products/cloud-systems-management/modeling-labs/index.html ---- - -- Developed a **multi-threaded Python microservice** for a Cisco internal SaaS ingesting usage telemetry data of Cisco Cat9kv switches from thousands of GNS3 networking projects to be stored in **Elastic Search**. -- Containerized and integrated **Elastic Search** and **Kibana** into existing microservices system. -- Created insightful **Kibana** charts highlighting Cat9kv switch flavors daily usage and number of daily users to present to Cisco Enterprise Networking Group executives. -- Wrote custom **Ansible** modules to synchronize folders across Cisco managed servers while ensuring 100% folder structure and files integrity with hashing algorithm utilizing Python SHA1 crytographic library. -- Automated custom **Ansible** modules testing with **Bash** scripts. Testing environment made with **Vagrant** and **Docker** to simulate production servers diff --git a/src/routes/(home).tsx b/src/routes/(home).tsx index cc612f8..9d3094e 100644 --- a/src/routes/(home).tsx +++ b/src/routes/(home).tsx @@ -19,8 +19,8 @@ const Homepage = () => { Montreal, Canada.

- I'm most passionate about designing distributed systems that scales - but I'm also interested in compilers and systems programming. + Things that I'm most passionate about: distributed systems, backend + development, compilers and systems programming.

When I'm not coding, I read books, listen to podcasts or study music @@ -29,7 +29,7 @@ const Homepage = () => {

Say hi:{" "} {