Shellnut_Public/personal-website-sveltekit
1
0
Fork 0
mirror of https://github.com/BradNut/personal-website-sveltekit synced 2025-09-08 23:20:18 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Update to show new website is in SvelteKit.

Browse source
This commit is contained in:
Bradley Shellnut 2023-04-20 11:14:52 -07:00
parent 86ddabc6ed
commit f467e1cbb4
4 changed files with 27 additions and 60 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

31
src/lib/content/portfolio/personal/personal-website-gatsby.md
View file

@ -1,31 +0,0 @@
---
portfolioName: 'Personal Website'
portfolioSubHeading: 'My personal website written using the following technologies.'
portfolioImage: 'Bradley_Shellnut_New_Site.png'
portfolioImageAlt: 'Home Page of bradleyshellnut.com'
---
<script>
import ExternalLink from '$lib/components/ExternalLink.svelte';
</script>
{portfolioSubHeading}
Tech Stack:
- React 18
- Gatsby 5
- <ExternalLink href="https://radix-ui.com" ariaLabel="Radix UI" showIcon>Radix UI</ExternalLink>
- Styled Components
- GraphQL
- Deployed using Netlify
- Most icons from <ExternalLink showIcon href="https://github.com/react-icons/react-icons" ariaLabel="React Icons">react-icons</ExternalLink>
- Bee, Shell, Nut, and Seattle Icons made by <ExternalLink showIcon href="https://www.flaticon.com/authors/freepik" ariaLabel="Freepik">"Freepik"</ExternalLink> from <ExternalLink showIcon href="https://www.flaticon.com" ariaLabel="Flaticon">flaticon.com</ExternalLink>
Current version was improved after the suggestions on <ExternalLink showIcon href="https://syntax.fm/show/444/syntax-highlight#t=33:19" ariaLabel="Syntax.fm Podcast Number 444">Show 444</ExternalLink> of the <ExternalLink showIcon
href="https://syntax.fm/show/444/syntax-highlight#t=33:19"
ariaLabel="Syntax.fm Podcast">Syntax Podcast</ExternalLink>.
You can view the previous archived version of my personal website <ExternalLink showIcon
href="https://web.archive.org/web/20210224002046/https://bradleyshellnut.com/"
ariaLabel="Archive before Syntax Podcast">here</ExternalLink>.

25
src/lib/content/portfolio/personal/personal-website-sveltekit.md Normal file
View file

@ -0,0 +1,25 @@
---
portfolioName: 'Personal Website'
portfolioSubHeading: 'My personal website re-written using SvelteKit.'
portfolioImage: 'Bradley_Shellnut_New_Site.png'
portfolioImageAlt: 'Home Page of bradleyshellnut.com'
---
<script>
import ExternalLink from '$lib/components/ExternalLink.svelte';
</script>
{portfolioSubHeading}
Tech Stack:
- <ExternalLink href="https://kit.svelte.dev/" showIcon>SvelteKit</ExternalLink>
- TypeScript
- Deployed on Vercel
- Bee, Shell, Nut, and Seattle Icons made by <ExternalLink showIcon href="https://www.flaticon.com/authors/freepik" ariaLabel="Freepik">"Freepik"</ExternalLink> from <ExternalLink showIcon href="https://www.flaticon.com" ariaLabel="Flaticon">flaticon.com</ExternalLink>
Previous version of my website was written using React and Gatsby which you can view <ExternalLink href="https://wonderful-austin-9f17d2.netlify.app/" ariaLabel="React and Gatsby Personal Site version" showIcon>here</ExternalLink>.
Each iteration brings better code and my previous React version was improved after the suggestions on <ExternalLink showIcon href="https://syntax.fm/show/444/syntax-highlight#t=33:19" ariaLabel="Syntax.fm Podcast Number 444">Show 444</ExternalLink> of the <ExternalLink href="https://syntax.fm/show/444/syntax-highlight#t=33:19" ariaLabel="Syntax.fm Podcast" showIcon>Syntax Podcast</ExternalLink>.
You can view the previous archived version of the site before those changes <ExternalLink href="https://web.archive.org/web/20210224002046/https://bradleyshellnut.com/" ariaLabel="Archive before Syntax Podcast" showIcon>here</ExternalLink>.

27
src/routes/portfolio/+page.server.ts
View file

@ -1,28 +1 @@
import { error } from '@sveltejs/kit';
import { compile } from 'mdsvex';
import type { PageServerLoad } from '../$types';
export const prerender = true;
export const load: PageServerLoad = async () => {
try {
const personalSiteGatsby = await import(
`../../lib/content/portfolio/personal/personal-website-gatsby.md`
);
const { default: page, metadata } = personalSiteGatsby;
// const [personalSiteGatsbyResponse] = await Promise.all([personalSiteGatsby]);
console.log(`page: ${JSON.stringify(page)}, metadata: ${JSON.stringify(metadata)}`);
// const compiledResponse = await compile(personalSiteGatsbyResponse);
// console.log(`compiledResponse is: ${JSON.stringify(compiledResponse)}`);
return {
portfolios: ''
};
} catch (e) {
console.error(e);
throw error(500, 'Error loading portfolios');
}
};

4
src/routes/portfolio/+page.svelte
View file

@ -13,7 +13,7 @@
import weddingWebsite from "$lib/assets/images/Wedding_Website.png?run";
import oldSite from '$lib/assets/images/Old_Website_Bradley_Shellnut.png?run';
import shellnutArchitectWebsite from "$lib/assets/images/Mark_Shellnut_Architect.png?run";
import PersonalWebsiteGatsby from "$lib/content/portfolio/personal/personal-website-gatsby.md";
import PersonalWebsiteSvelteKit from "$lib/content/portfolio/personal/personal-website-sveltekit.md";
import WeddingWebsite from '$lib/content/portfolio/personal/wedding-website.md';
import MarkShellnutArchitect from '$lib/content/portfolio/professional/mark-shellnut-architect.md?run';
import OldWebsite from '$lib/content/portfolio/personal/old-website.md';
@ -39,7 +39,7 @@
src={personalSite}
loading="eager"
alt="Picture of Bradley Shellnut's Gatsby Personal Website">
<PersonalWebsiteGatsby slot="portfolio-details" />
<PersonalWebsiteSvelteKit slot="portfolio-details" />
</Portfolio>
<Portfolio name="Wedding Website"
style="max-height: 640px;"