luke-else/luke-else.co.uk
1
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

feature/devcontainer #55

Merged
luke-else merged 4 commits from feature/devcontainer into main 2025-09-26 09:18:24 +00:00
Conversation 0 Commits 4 Files Changed 25 +823 -803
25 changed files with 823 additions and 803 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
.devcontainer/devcontainer.json Normal file
View File

@@ -0,0 +1,18 @@
{
"name": "luke-else.co.uk",
"image": "git.luke-else.co.uk/luke-else/lab:latest",
"remoteUser": "dev",
"customizations": {
"vscode": {
"settings": {
"terminal.integrated.defaultProfile.linux": "zsh"
},
"extensions": [
"ms-azuretools.vscode-docker",
"ms-vscode-remote.remote-containers",
"svelte.svelte-vscode"
]
}
},
"postCreateCommand": "pnpm install"
}

36
.dockerignore
View File

@@ -1,19 +1,19 @@
# .dockerignore
.vscode
node_modules
.git
.gitattributes
.gitea
.eslintignore
.eslintrc.cjs
.prettierrc
.pretieriignore
README.md
# .dockerignore
.vscode
node_modules
.git
.gitattributes
.gitea
.eslintignore
.eslintrc.cjs
.prettierrc
.pretieriignore
README.md
Dockerfile

60
.gitea/workflows/dev.yaml
View File

@@ -1,30 +1,30 @@
name: Build and Push Development Docker Image
on:
push:
branches: [ development ]
jobs:
build-and-push:
runs-on: ubuntu-latest
steps:
- name: Checkout Repository
uses: actions/checkout@v4
- name: Log in to Docker Hub
uses: docker/login-action@v3
with:
registry: ${{ secrets.CONTAINER_REGISTRY }}
username: ${{ secrets.CONTAINER_REGISTRY_USERNAME }}
password: ${{ secrets.CONTAINER_REGISTRY_PASSKEY }}
- name: Set up Docker Buildx
uses: docker/setup-buildx-action@v3
- name: Build and Tag Docker Image
run: |
docker build -t ${{ secrets.CONTAINER_REGISTRY }}/${{ secrets.CONTAINER_REGISTRY_USERNAME }}/luke-else.co.uk:dev .
- name: Push Docker Image
run: |
docker push ${{ secrets.CONTAINER_REGISTRY }}/${{ secrets.CONTAINER_REGISTRY_USERNAME }}/luke-else.co.uk:dev
name: Build and Push Development Docker Image
on:
push:
branches: [ development ]
jobs:
build-and-push:
runs-on: ubuntu-latest
steps:
- name: Checkout Repository
uses: actions/checkout@v4
- name: Log in to Docker Hub
uses: docker/login-action@v3
with:
registry: ${{ secrets.CONTAINER_REGISTRY }}
username: ${{ secrets.CONTAINER_REGISTRY_USERNAME }}
password: ${{ secrets.CONTAINER_REGISTRY_PASSKEY }}
- name: Set up Docker Buildx
uses: docker/setup-buildx-action@v3
- name: Build and Tag Docker Image
run: |
docker build -t ${{ secrets.CONTAINER_REGISTRY }}/${{ secrets.CONTAINER_REGISTRY_USERNAME }}/luke-else.co.uk:dev .
- name: Push Docker Image
run: |
docker push ${{ secrets.CONTAINER_REGISTRY }}/${{ secrets.CONTAINER_REGISTRY_USERNAME }}/luke-else.co.uk:dev

60
.gitea/workflows/main.yaml
View File

@@ -1,30 +1,30 @@
name: Build and Push Latest Docker Image
on:
push:
branches: [ main ]
jobs:
build-and-push:
runs-on: ubuntu-latest
steps:
- name: Checkout Repository
uses: actions/checkout@v4
- name: Log in to Docker Hub
uses: docker/login-action@v3
with:
registry: ${{ secrets.CONTAINER_REGISTRY }}
username: ${{ secrets.CONTAINER_REGISTRY_USERNAME }}
password: ${{ secrets.CONTAINER_REGISTRY_PASSKEY }}
- name: Set up Docker Buildx
uses: docker/setup-buildx-action@v3
- name: Build and Tag Docker Image
run: |
docker build -t ${{ secrets.CONTAINER_REGISTRY }}/${{ secrets.CONTAINER_REGISTRY_USERNAME }}/luke-else.co.uk:latest .
- name: Push Docker Image
run: |
docker push ${{ secrets.CONTAINER_REGISTRY }}/${{ secrets.CONTAINER_REGISTRY_USERNAME }}/luke-else.co.uk:latest
name: Build and Push Latest Docker Image
on:
push:
branches: [ main ]
jobs:
build-and-push:
runs-on: ubuntu-latest
steps:
- name: Checkout Repository
uses: actions/checkout@v4
- name: Log in to Docker Hub
uses: docker/login-action@v3
with:
registry: ${{ secrets.CONTAINER_REGISTRY }}
username: ${{ secrets.CONTAINER_REGISTRY_USERNAME }}
password: ${{ secrets.CONTAINER_REGISTRY_PASSKEY }}
- name: Set up Docker Buildx
uses: docker/setup-buildx-action@v3
- name: Build and Tag Docker Image
run: |
docker build -t ${{ secrets.CONTAINER_REGISTRY }}/${{ secrets.CONTAINER_REGISTRY_USERNAME }}/luke-else.co.uk:latest .
- name: Push Docker Image
run: |
docker push ${{ secrets.CONTAINER_REGISTRY }}/${{ secrets.CONTAINER_REGISTRY_USERNAME }}/luke-else.co.uk:latest

23
.gitignore vendored
View File

@@ -1,11 +1,12 @@
.DS_Store
node_modules
/build
/.svelte-kit
/package
.env
.env.*
!.env.example
vite.config.js.timestamp-*
vite.config.ts.timestamp-*
.vscode
.DS_Store
node_modules
.pnpm-store
/build
/.svelte-kit
/package
.env
.env.*
!.env.example
vite.config.js.timestamp-*
vite.config.ts.timestamp-*
.vscode

8
.npmrc
View File

@@ -1,4 +1,4 @@
engine-strict=true
resolution-mode=highest
@luke-else:registry=https://git.luke-else.co.uk/api/packages/luke-else/npm/
engine-strict=true
resolution-mode=highest
@luke-else:registry=https://git.luke-else.co.uk/api/packages/luke-else/npm/

26
.prettierignore
View File

@@ -1,13 +1,13 @@
.DS_Store
node_modules
/build
/.svelte-kit
/package
.env
.env.*
!.env.example
# Ignore files for PNPM, NPM and YARN
pnpm-lock.yaml
package-lock.json
yarn.lock
.DS_Store
node_modules
/build
/.svelte-kit
/package
.env
.env.*
!.env.example
# Ignore files for PNPM, NPM and YARN
pnpm-lock.yaml
package-lock.json
yarn.lock

20
.prettierrc
View File

@@ -1,10 +1,10 @@
{
"useTabs": false,
"tabWidth": 4,
"singleQuote": true,
"trailingComma": "none",
"printWidth": 100,
"plugins": ["prettier-plugin-svelte"],
"pluginSearchDirs": ["."],
"overrides": [{ "files": "*.svelte", "options": { "parser": "svelte" } }]
}
{
"useTabs": false,
"tabWidth": 4,
"singleQuote": true,
"trailingComma": "none",
"printWidth": 100,
"plugins": ["prettier-plugin-svelte"],
"pluginSearchDirs": ["."],
"overrides": [{ "files": "*.svelte", "options": { "parser": "svelte" } }]
}

112
README.md
View File

@@ -1,56 +1,56 @@
## Welcome
This site contains information relating to my personal situation, however, you are able to clone this project and change the `me.json` file to update this as required.
## Screenshots
<p align="center">
<img src="assets/images/main.png" width="40%">
<img src="assets/images/light_mode.png" width="40%">
</p>
<p align="center">
<img src="assets/images/skills.png" width="30%">
<img src="assets/images/repos.png" width="30%">
<img src="assets/images/contact.png" width="30%">
</p>
<p align="center">
<img src="assets/images/experience.png" width="30%">
</p>
## Getting Started
Get starting but installing all of the dependencies of the project.
```bash
npm install
```
Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server:
```bash
npm run dev
```
```bash
# or start the server and open the app in a new browser tab
npm run dev -- --open
```
## Building
To create a production version of the app:
```bash
npm run build
```
You can preview the production build with `npm run preview`.
> To deploy your app, you may need to install an [adapter](https://kit.svelte.dev/docs/adapters) for your target environment. In this case, vite is used.
## Welcome
This site contains information relating to my personal situation, however, you are able to clone this project and change the `me.json` file to update this as required.
## Screenshots
<p align="center">
<img src="assets/images/main.png" width="40%">
<img src="assets/images/light_mode.png" width="40%">
</p>
<p align="center">
<img src="assets/images/skills.png" width="30%">
<img src="assets/images/repos.png" width="30%">
<img src="assets/images/contact.png" width="30%">
</p>
<p align="center">
<img src="assets/images/experience.png" width="30%">
</p>
## Getting Started
Get starting but installing all of the dependencies of the project.
```bash
npm install
```
Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server:
```bash
npm run dev
```
```bash
# or start the server and open the app in a new browser tab
npm run dev -- --open
```
## Building
To create a production version of the app:
```bash
npm run build
```
You can preview the production build with `npm run preview`.
> To deploy your app, you may need to install an [adapter](https://kit.svelte.dev/docs/adapters) for your target environment. In this case, vite is used.

42
dockerfile
View File

@@ -1,21 +1,21 @@
FROM git.luke-else.co.uk/luke-else/nodejs:latest AS build
WORKDIR /app
COPY package*.json ./
RUN rm -rf node_modules
RUN rm -rf build
COPY . .
RUN pnpm install
RUN pnpm run build
FROM git.luke-else.co.uk/luke-else/nodejs:latest AS run
WORKDIR /app
COPY --from=build /app/package.json ./package.json
COPY --from=build /app/.npmrc ./.npmrc
COPY --from=build /app/build ./build
RUN pnpm install --prod
EXPOSE 3000
ENTRYPOINT [ "pnpm", "run", "start" ]
FROM git.luke-else.co.uk/luke-else/nodejs:latest AS build
WORKDIR /app
COPY package*.json ./
RUN rm -rf node_modules
RUN rm -rf build
COPY . .
RUN pnpm install
RUN pnpm run build
FROM git.luke-else.co.uk/luke-else/nodejs:latest AS run
WORKDIR /app
COPY --from=build /app/package.json ./package.json
COPY --from=build /app/.npmrc ./.npmrc
COPY --from=build /app/build ./build
RUN pnpm install --prod
EXPOSE 3000
ENTRYPOINT [ "pnpm", "run", "start" ]

24
src/app.d.ts vendored
View File

@@ -1,12 +1,12 @@
// See https://kit.svelte.dev/docs/types#app
// for information about these interfaces
declare global {
namespace App {
// interface Error {}
// interface Locals {}
// interface PageData {}
// interface Platform {}
}
}
export {};
// See https://kit.svelte.dev/docs/types#app
// for information about these interfaces
declare global {
namespace App {
// interface Error {}
// interface Locals {}
// interface PageData {}
// interface Platform {}
}
}
export {};

62
src/app.html
View File

@@ -1,31 +1,31 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta
name="description"
content="Luke Else - Software Developer at Thales UK. I specialise in developing distributed systems in C++ using highly scalable internal frameworks. I also develop backend and system applications in my spare time using both Svelte, Rust and C++. Feel free to check my work out at https://git.luke-else.co.uk."
/>
<meta name="author" content="Luke Else (mail@luke-else.co.uk)" />
<link rel="icon" href="%sveltekit.assets%/favicon.png" />
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/gh/devicons/devicon@v2.15.1/devicon.min.css"
/>
<meta name="viewport" content="width=device-width" />
<script
async
src="https://tracking.luke-else.co.uk/tracker.js"
data-ackee-server="https://tracking.luke-else.co.uk"
data-ackee-domain-id="6c59ab88-dc6d-4d53-9831-0d6bff919dcd"
data-ackee-opts='{ "detailed": true }'
></script>
%sveltekit.head%
<style></style>
</head>
<body data-sveltekit-preload-data="hover">
<div style="display: contents">%sveltekit.body%</div>
</body>
</html>
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta
name="description"
content="Luke Else - Software Developer at Thales UK. I specialise in developing distributed systems in C++ using highly scalable internal frameworks. I also develop backend and system applications in my spare time using both Svelte, Rust and C++. Feel free to check my work out at https://git.luke-else.co.uk."
/>
<meta name="author" content="Luke Else (mail@luke-else.co.uk)" />
<link rel="icon" href="%sveltekit.assets%/favicon.png" />
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/gh/devicons/devicon@v2.15.1/devicon.min.css"
/>
<meta name="viewport" content="width=device-width" />
<script
async
src="https://tracking.luke-else.co.uk/tracker.js"
data-ackee-server="https://tracking.luke-else.co.uk"
data-ackee-domain-id="6c59ab88-dc6d-4d53-9831-0d6bff919dcd"
data-ackee-opts='{ "detailed": true }'
></script>
%sveltekit.head%
<style></style>
</head>
<body data-sveltekit-preload-data="hover">
<div style="display: contents">%sveltekit.body%</div>
</body>
</html>

132
src/lib/api/git.ts
View File

@@ -1,67 +1,67 @@
import type { GitRepo } from "../types";
const API_BASE_URL = "https://git.luke-else.co.uk/api/v1";
export const IMAGE_URL_SUFFIX = "/raw/branch/main/assets/images/main.png";
export async function fetchRepos(): Promise<GitRepo[]> {
try {
console.log("Fetching repos...");
const response = await fetch(`${API_BASE_URL}/repos/search?sort=updated&order=desc&limit=12`, {
headers: {
// "Authorization": `token ${ACCESS_TOKEN}`,
"Content-Type": "application/json"
}
});
if (!response.ok) {
throw new Error(`Error: ${response.statusText}`);
}
const data: { data: GitRepo[] } = await response.json();
return data.data; // Extract the list of repositories
} catch (error) {
console.error("Failed to fetch repos:", error);
return [];
}
}
export function timeSince(inputDate: Date | string): string {
const date = new Date(inputDate); // Ensure it's a Date object
if (isNaN(date.getTime())) {
throw new Error("Invalid date provided");
}
const now: Date = new Date();
const diffInMs: number = now.getTime() - date.getTime();
const diffInSeconds: number = Math.floor(diffInMs / 1000);
const diffInMinutes: number = Math.floor(diffInSeconds / 60);
const diffInHours: number = Math.floor(diffInMinutes / 60);
const diffInDays: number = Math.floor(diffInHours / 24);
const diffInMonths: number = Math.floor(diffInDays / 30); // Approximate
const diffInYears: number = Math.floor(diffInDays / 365); // Approximate
if (diffInDays === 0) return "Today";
if (diffInDays === 1) return "Yesterday";
if (diffInDays < 7) return `${diffInDays} days ago`;
if (diffInDays < 30) return `${Math.floor(diffInDays / 7)} week${diffInDays >= 14 ? 's' : ''} ago`;
if (diffInMonths < 12) return `${diffInMonths} month${diffInMonths > 1 ? 's' : ''} ago`;
return `${diffInYears} year${diffInYears > 1 ? 's' : ''} ago`;
}
export async function checkImage(repo: GitRepo): Promise<boolean> {
try {
const URL = repo.html_url + IMAGE_URL_SUFFIX;
console.log("Checking image:", URL);
const response = await fetch(URL);
if (response.ok) {
console.log("Image found!");
return true;
} else {
console.log("Image not found!");
return false;
}
} catch (error) {
return false;
}
import type { GitRepo } from "../types";
const API_BASE_URL = "https://git.luke-else.co.uk/api/v1";
export const IMAGE_URL_SUFFIX = "/raw/branch/main/assets/images/main.png";
export async function fetchRepos(): Promise<GitRepo[]> {
try {
console.log("Fetching repos...");
const response = await fetch(`${API_BASE_URL}/repos/search?sort=updated&order=desc&limit=12`, {
headers: {
// "Authorization": `token ${ACCESS_TOKEN}`,
"Content-Type": "application/json"
}
});
if (!response.ok) {
throw new Error(`Error: ${response.statusText}`);
}
const data: { data: GitRepo[] } = await response.json();
return data.data; // Extract the list of repositories
} catch (error) {
console.error("Failed to fetch repos:", error);
return [];
}
}
export function timeSince(inputDate: Date | string): string {
const date = new Date(inputDate); // Ensure it's a Date object
if (isNaN(date.getTime())) {
throw new Error("Invalid date provided");
}
const now: Date = new Date();
const diffInMs: number = now.getTime() - date.getTime();
const diffInSeconds: number = Math.floor(diffInMs / 1000);
const diffInMinutes: number = Math.floor(diffInSeconds / 60);
const diffInHours: number = Math.floor(diffInMinutes / 60);
const diffInDays: number = Math.floor(diffInHours / 24);
const diffInMonths: number = Math.floor(diffInDays / 30); // Approximate
const diffInYears: number = Math.floor(diffInDays / 365); // Approximate
if (diffInDays === 0) return "Today";
if (diffInDays === 1) return "Yesterday";
if (diffInDays < 7) return `${diffInDays} days ago`;
if (diffInDays < 30) return `${Math.floor(diffInDays / 7)} week${diffInDays >= 14 ? 's' : ''} ago`;
if (diffInMonths < 12) return `${diffInMonths} month${diffInMonths > 1 ? 's' : ''} ago`;
return `${diffInYears} year${diffInYears > 1 ? 's' : ''} ago`;
}
export async function checkImage(repo: GitRepo): Promise<boolean> {
try {
const URL = repo.html_url + IMAGE_URL_SUFFIX;
console.log("Checking image:", URL);
const response = await fetch(URL);
if (response.ok) {
console.log("Image found!");
return true;
} else {
console.log("Image not found!");
return false;
}
} catch (error) {
return false;
}
}

8
src/lib/data.ts
View File

@@ -1,5 +1,5 @@
export async function getJson(path: string) {
let response = await fetch(path);
let users = await response.json();
return users;
export async function getJson(path: string) {
let response = await fetch(path);
let users = await response.json();
return users;
}

22
src/lib/stores.ts
View File

@@ -1,12 +1,12 @@
import { writable } from "svelte/store";
import type { GitRepo } from "./types";
import { fetchRepos } from "./api/git";
////////////////////////////////////////
// Git Repo Stores
////////////////////////////////////////
export const repos = writable<GitRepo[]>([]);
export async function loadRepos() {
repos.set(await fetchRepos());
import { writable } from "svelte/store";
import type { GitRepo } from "./types";
import { fetchRepos } from "./api/git";
////////////////////////////////////////
// Git Repo Stores
////////////////////////////////////////
export const repos = writable<GitRepo[]>([]);
export async function loadRepos() {
repos.set(await fetchRepos());
}

44
src/lib/types.ts
View File

@@ -1,22 +1,22 @@
export type TimelinePosition = 'right' | 'left' | 'alternate';
export type ParentPosition = 'right' | 'left';
export type TimelineConfig = {
rootPosition: TimelinePosition;
};
export interface GitRepo {
name: string;
description: string;
language: string;
size: number;
updated_at: Date;
html_url: string;
private: boolean;
fork: boolean;
owner: {
login: string;
avatar_url: string;
};
}
export type TimelinePosition = 'right' | 'left' | 'alternate';
export type ParentPosition = 'right' | 'left';
export type TimelineConfig = {
rootPosition: TimelinePosition;
};
export interface GitRepo {
name: string;
description: string;
language: string;
size: number;
updated_at: Date;
html_url: string;
private: boolean;
fork: boolean;
owner: {
login: string;
avatar_url: string;
};
}

171
src/main.svelte
View File

@@ -1,85 +1,86 @@
<script lang="ts">
import { getJson } from '$lib/data';
import { toasts } from 'svelte-toasts';
import {
Loading,
Section,
Card,
GridGallery,
SkillProgress,
Timeline,
Collapsible
} from '@luke-else/component-lib';
</script>
{#await getJson('/json/me.json')}
<Loading />
{:then info}
<div style="display: none;">
{toasts.add({
title: 'Welcome',
duration: 5000,
type: 'success',
placement: 'bottom-center',
showProgress: true
})}
</div>
<!-- Main Card -->
<Section label="[About]">
<Card>
<h2 slot="headerLeft">{info.name}</h2>
<h2 slot="headerRight">{info.job_title}</h2>
<div slot="content" class="flex flex-row items-center gap-5">
<img
src={info.profile_photo}
alt="Avatar"
class="max-md:hidden rounded-full w-32 h-32 md:w-48 md:h-48 mt-2 mb-2 p-2 border-3"
/>
<p
class="[&>*]:underline [&>*]:decoration-2 [&>*]:decoration-transparent [&>*]:hover:decoration-inherit [&>*]:transition-all [&>*]:duration-300 [&>*]:text-green-600"
>
{@html info.about}
</p>
</div>
<h3 slot="footerLeft">{@html info.location}</h3>
</Card>
</Section>
<!-- SKills -->
<Section label="[Skills]">
<GridGallery>
{#each info.skills as skill}
<Card
containerStyle="opacity-100 hover:opacity-100 hover:scale-[105%] md:opacity-70 transition-all duration-300"
>
<h2 slot="headerLeft">{skill.name}</h2>
<i slot="headerRight" class="text-slate-300 text-5xl {skill.logo}"></i>
<div slot="content">
<Collapsible>
<span slot="label" class="text-lg">About {skill.name}</span>
<span slot="content">{skill.about}</span>
</Collapsible>
<SkillProgress skillColour={skill.colour} value={skill.competency} />
</div>
<h3 slot="footerLeft"><a href={skill.link} target="_blank">{skill.link}</a></h3>
</Card>
{/each}
</GridGallery>
</Section>
<Section label="[Experience]">
<Timeline timelineData={info.timeline} />
</Section>
{:catch}
<div style="display: none;">
{toasts.add({
title: 'Error',
description: 'There was an error loading static site data',
duration: 0,
placement: 'bottom-center',
showProgress: true
})}
</div>
{/await}
<script lang="ts">
import { getJson } from '$lib/data';
import { toasts } from 'svelte-toasts';
import {
Loading,
Section,
Card,
GridGallery,
SkillProgress,
Timeline,
Collapsible
} from '@luke-else/component-lib';
</script>
{#await getJson('/json/me.json')}
<Loading />
{:then info}
<div style="display: none;">
{toasts.add({
title: 'Welcome',
duration: 5000,
type: 'success',
placement: 'bottom-center',
showProgress: true
})}
</div>
<!-- Main Card -->
<Section label="[About]">
<Card>
<h2 slot="headerLeft">{info.name}</h2>
<h2 slot="headerRight">{info.job_title}</h2>
<div slot="content" class="flex flex-row items-center gap-5">
<img
src={info.profile_photo}
alt="Avatar"
class="max-md:hidden rounded-full w-32 h-32 md:w-48 md:h-48 mt-2 mb-2 p-2 border-3"
/>
<p
class="[&>*]:underline [&>*]:decoration-2 [&>*]:decoration-transparent [&>*]:hover:decoration-inherit [&>*]:transition-all [&>*]:duration-300 [&>*]:text-green-600"
>
{@html info.about}
</p>
</div>
<h3 slot="footerLeft">{@html info.location}</h3>
</Card>
</Section>
<!-- Skills -->
<Section label="[Skills]">
<GridGallery>
{#each info.skills as skill}
<Card
containerStyle="opacity-100 hover:opacity-100 hover:scale-[105%] md:opacity-70 transition-all duration-300"
>
<h2 slot="headerLeft">{skill.name}</h2>
<i slot="headerRight" class="text-slate-300 text-5xl {skill.logo}"></i>
<div slot="content">
<Collapsible>
<span slot="label" class="text-lg">About {skill.name}</span>
<span slot="content">{skill.about}</span>
</Collapsible>
<SkillProgress skillColour={skill.colour} value={skill.competency} />
</div>
<h3 slot="footerLeft"><a href={skill.link} target="_blank">{skill.link}</a></h3>
</Card>
{/each}
</GridGallery>
</Section>
<!-- Experience -->
<Section label="[Experience]">
<Timeline timelineData={info.timeline} />
</Section>
{:catch}
<div style="display: none;">
{toasts.add({
title: 'Error',
description: 'There was an error loading static site data',
duration: 0,
placement: 'bottom-center',
showProgress: true
})}
</div>
{/await}

56
src/routes/+layout.svelte
View File

@@ -1,28 +1,28 @@
<script lang="ts">
import '../app.css';
import { ToastContainer, FlatToast } from 'svelte-toasts';
import { PageIcon } from '@luke-else/component-lib';
</script>
<div
class="min-h-screen px-8 py-4 bg-white text-slate-600 dark:bg-slate-900/90 dark:text-slate-200/60 md:text-2xl sm:text-md font-mono flex flex-col gap-5 transition duration-1000 ease-in-out"
>
<nav
class="w-full px-8 py-4 flex gap-10 text-xl justify-center items-center text-green-600 font-semibold"
>
<a href="/" class="hover:underline">//Profile</a>
<a href="/repos" class="hover:underline">//Repos</a>
<a href="/contact" class="hover:underline">//Contact</a>
</nav>
<a href="https://git.luke-else.co.uk" target="_blank">
<PageIcon iconClass="devicon-git-plain" />
</a>
<div class="container mx-auto justify-center items-center flex flex-col">
<slot />
<ToastContainer let:data>
<FlatToast {data} />
</ToastContainer>
</div>
</div>
<script lang="ts">
import '../app.css';
import { ToastContainer, FlatToast } from 'svelte-toasts';
import { PageIcon } from '@luke-else/component-lib';
</script>
<div
class="min-h-screen px-8 py-4 bg-white text-slate-600 dark:bg-slate-900/90 dark:text-slate-200/60 md:text-2xl sm:text-md font-mono flex flex-col gap-5 transition duration-1000 ease-in-out"
>
<nav
class="w-full px-8 py-4 flex gap-10 text-xl justify-center items-center text-green-600 font-semibold"
>
<a href="/" class="hover:underline">//Profile</a>
<a href="/repos" class="hover:underline">//Repos</a>
<a href="/contact" class="hover:underline">//Contact</a>
</nav>
<a href="https://git.luke-else.co.uk" target="_blank">
<PageIcon iconClass="devicon-git-plain" />
</a>
<div class="container mx-auto justify-center items-center flex flex-col">
<slot />
<ToastContainer let:data>
<FlatToast {data} />
</ToastContainer>
</div>
</div>

12
src/routes/+page.svelte
View File

@@ -1,7 +1,7 @@
<script>
import Main from '../main.svelte';
</script>
<div>
<Main></Main>
<script>
import Main from '../main.svelte';
</script>
<div>
<Main></Main>
</div>

206
src/routes/contact/+page.svelte
View File

@@ -1,103 +1,103 @@
<script lang="ts">
import { toasts } from 'svelte-toasts';
import { Card, Section } from '@luke-else/component-lib';
import { page } from '$app/state';
const sent = page.url.searchParams.get('sent');
if (sent == 'true') {
toasts.add({
title: 'Message sent!',
description: 'Thank you for contacting me.',
type: 'success',
duration: 4000,
placement: 'bottom-center'
});
}
if (sent == 'false') {
toasts.add({
title: 'Message not sent!',
description: 'Please try again later.',
type: 'error',
duration: 4000,
placement: 'bottom-center'
});
}
</script>
<Section label="[Contact]">
<div>
</div>
<Card>
<div slot="headerLeft">
Contact Me
</div>
<!-- Contact Form -->
<form slot="content" class="w-full max-w-3xl mx-auto flex flex-col gap-4 text-lg" action="https://api.staticforms.xyz/submit" method="post">
<div class="hidden">
<input type="hidden" name="accessKey" value="fbb5ec04-506b-448a-a445-a2e47579a966">
<input type="hidden" name="replyTo" value="@">
<input type="text" name="honeypot" style="display: none;">
<input type="hidden" name="redirectTo" value="https://luke-else.co.uk/contact?sent=true">
</div>
<div class="flex flex-row md:flex-row gap-3">
<div class="flex-1">
<label class="block text-xs font-medium mb-1" for="name">Name</label>
<input
id="name"
name="name"
type="text"
class="w-full rounded-lg border border-gray-400 px-3 py-1.5 focus:outline-none focus:ring-2 focus:ring-blue-600 transition placeholder-gray-400"
required
placeholder="Your name"
/>
</div>
<div class="flex-1">
<label class="block text-xs font-medium mb-1" for="email">Email</label>
<input
id="email"
name="email"
type="email"
class="w-full rounded-lg border border-gray-400 px-3 py-1.5 focus:outline-none focus:ring-2 focus:ring-blue-600 transition placeholder-gray-400"
required
placeholder="you@email.com"
/>
</div>
<div class="flex-1">
<label class="block text-xs font-medium mb-1" for="subject">Subject</label>
<input
id="subject"
name="subject"
type="text"
class="w-full rounded-lg border border-gray-400 px-3 py-1.5 focus:outline-none focus:ring-2 focus:ring-blue-600 transition placeholder-gray-400"
required
placeholder="Subject"
/>
</div>
</div>
<div>
<label class="block text-xs font-medium mb-1" for="message">Message</label>
<textarea
id="message"
name="message"
class="w-full rounded-lg border border-gray-400 px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-600 transition min-h-[80px] placeholder-gray-400"
required
placeholder="Your message"
></textarea>
</div>
<!-- reCAPTCHA integration -->
<div class="">
<div class="g-recaptcha" data-sitekey="6LfjQAwrAAAAAIF57u8Wt4w5L5vBEWi5DfXXBuGy"></div>
<script src="https://www.google.com/recaptcha/api.js" async defer></script>
</div>
<button
type="submit"
class="self-end bg-blue-600 hover:bg-blue-700 text-white font-semibold py-1.5 px-8 rounded-lg transition"
>
Send Message
</button>
</form>
</Card>
</Section>
<script lang="ts">
import { toasts } from 'svelte-toasts';
import { Card, Section } from '@luke-else/component-lib';
import { page } from '$app/state';
const sent = page.url.searchParams.get('sent');
if (sent == 'true') {
toasts.add({
title: 'Message sent!',
description: 'Thank you for contacting me.',
type: 'success',
duration: 4000,
placement: 'bottom-center'
});
}
if (sent == 'false') {
toasts.add({
title: 'Message not sent!',
description: 'Please try again later.',
type: 'error',
duration: 4000,
placement: 'bottom-center'
});
}
</script>
<Section label="[Contact]">
<div>
</div>
<Card>
<div slot="headerLeft">
Contact Me
</div>
<!-- Contact Form -->
<form slot="content" class="w-full max-w-3xl mx-auto flex flex-col gap-4 text-lg" action="https://api.staticforms.xyz/submit" method="post">
<div class="hidden">
<input type="hidden" name="accessKey" value="fbb5ec04-506b-448a-a445-a2e47579a966">
<input type="hidden" name="replyTo" value="@">
<input type="text" name="honeypot" style="display: none;">
<input type="hidden" name="redirectTo" value="https://luke-else.co.uk/contact?sent=true">
</div>
<div class="flex flex-row md:flex-row gap-3">
<div class="flex-1">
<label class="block text-xs font-medium mb-1" for="name">Name</label>
<input
id="name"
name="name"
type="text"
class="w-full rounded-lg border border-gray-400 px-3 py-1.5 focus:outline-none focus:ring-2 focus:ring-blue-600 transition placeholder-gray-400"
required
placeholder="Your name"
/>
</div>
<div class="flex-1">
<label class="block text-xs font-medium mb-1" for="email">Email</label>
<input
id="email"
name="email"
type="email"
class="w-full rounded-lg border border-gray-400 px-3 py-1.5 focus:outline-none focus:ring-2 focus:ring-blue-600 transition placeholder-gray-400"
required
placeholder="you@email.com"
/>
</div>
<div class="flex-1">
<label class="block text-xs font-medium mb-1" for="subject">Subject</label>
<input
id="subject"
name="subject"
type="text"
class="w-full rounded-lg border border-gray-400 px-3 py-1.5 focus:outline-none focus:ring-2 focus:ring-blue-600 transition placeholder-gray-400"
required
placeholder="Subject"
/>
</div>
</div>
<div>
<label class="block text-xs font-medium mb-1" for="message">Message</label>
<textarea
id="message"
name="message"
class="w-full rounded-lg border border-gray-400 px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-600 transition min-h-[80px] placeholder-gray-400"
required
placeholder="Your message"
></textarea>
</div>
<!-- reCAPTCHA integration -->
<div class="">
<div class="g-recaptcha" data-sitekey="6LfjQAwrAAAAAIF57u8Wt4w5L5vBEWi5DfXXBuGy"></div>
<script src="https://www.google.com/recaptcha/api.js" async defer></script>
</div>
<button
type="submit"
class="self-end bg-blue-600 hover:bg-blue-700 text-white font-semibold py-1.5 px-8 rounded-lg transition"
>
Send Message
</button>
</form>
</Card>
</Section>

146
src/routes/repos/+page.svelte
View File

@@ -1,73 +1,73 @@
<script lang="ts">
import { loadRepos, repos } from '$lib/stores';
import { timeSince, checkImage, IMAGE_URL_SUFFIX } from '$lib/api/git';
import { toasts } from 'svelte-toasts';
import { GridGallery, Card, Loading, Section, Collapsible } from '@luke-else/component-lib';
let repoImages: Record<string, string | null> = {};
// When repos load, check for images
$: if ($repos.length) {
(async () => {
for (const repo of $repos) {
if (repoImages[repo.name] === undefined) {
const url = repo.html_url + IMAGE_URL_SUFFIX;
repoImages[repo.name] = (await checkImage(repo)) ? url : null;
}
}
})();
}
</script>
<Section label="[Repositories]">
{#await loadRepos()}
<Loading />
{:then _}
{#if $repos.length == 0}
{console.log('No Repos')}
<div style="display: none;">
{toasts.add({
title: 'Error',
description: 'Failed to load repositories',
duration: 5000,
type: 'error',
placement: 'bottom-center',
showProgress: true
})}
</div>
<p>Sorry... we can't show you anything here</p>
{/if}
<!-- Repositories loaded successfully -->
<GridGallery>
{#each $repos as repo}
<!-- <Loading /> -->
<Card
containerStyle="opacity-100 hover:opacity-100 hover:scale-[105%] md:opacity-70 transition-all duration-300"
>
<h2 slot="headerLeft">{repo.name}</h2>
<h2 slot="headerRight" class="text-sm text-gray-500">
{repo.language}
</h2>
<div class="flex flex-col gap-5" slot="content">
{repo.description}
{#if repoImages[repo.name]}
<Collapsible>
<span slot="label" class="text-lg">See More</span>
<!-- svelte-ignore a11y_img_redundant_alt -->
<img
slot="content"
src={repoImages[repo.name]}
alt="repo image"
class=""
/>
</Collapsible>
{/if}
</div>
<h3 slot="footerLeft">
Last Updated: {timeSince(repo.updated_at)}
</h3>
</Card>
{/each}
</GridGallery>
{/await}
</Section>
<script lang="ts">
import { loadRepos, repos } from '$lib/stores';
import { timeSince, checkImage, IMAGE_URL_SUFFIX } from '$lib/api/git';
import { toasts } from 'svelte-toasts';
import { GridGallery, Card, Loading, Section, Collapsible } from '@luke-else/component-lib';
let repoImages: Record<string, string | null> = {};
// When repos load, check for images
$: if ($repos.length) {
(async () => {
for (const repo of $repos) {
if (repoImages[repo.name] === undefined) {
const url = repo.html_url + IMAGE_URL_SUFFIX;
repoImages[repo.name] = (await checkImage(repo)) ? url : null;
}
}
})();
}
</script>
<Section label="[Repositories]">
{#await loadRepos()}
<Loading />
{:then _}
{#if $repos.length == 0}
{console.log('No Repos')}
<div style="display: none;">
{toasts.add({
title: 'Error',
description: 'Failed to load repositories',
duration: 5000,
type: 'error',
placement: 'bottom-center',
showProgress: true
})}
</div>
<p>Sorry... we can't show you anything here</p>
{/if}
<!-- Repositories loaded successfully -->
<GridGallery>
{#each $repos as repo}
<!-- <Loading /> -->
<Card
containerStyle="opacity-100 hover:opacity-100 hover:scale-[105%] md:opacity-70 transition-all duration-300"
>
<h2 slot="headerLeft">{repo.name}</h2>
<h2 slot="headerRight" class="text-sm text-gray-500">
{repo.language}
</h2>
<div class="flex flex-col gap-5" slot="content">
{repo.description}
{#if repoImages[repo.name]}
<Collapsible>
<span slot="label" class="text-lg">See More</span>
<!-- svelte-ignore a11y_img_redundant_alt -->
<img
slot="content"
src={repoImages[repo.name]}
alt="repo image"
class=""
/>
</Collapsible>
{/if}
</div>
<h3 slot="footerLeft">
Last Updated: {timeSince(repo.updated_at)}
</h3>
</Card>
{/each}
</GridGallery>
{/await}
</Section>

262
static/json/me.json
View File

@@ -1,132 +1,132 @@
{
"name": "Luke Else",
"job_title": "Software Engineer",
"location": "Crawley, Sussex <br /> UK",
"profile_photo": "/profile.jpg",
"about": "Hello! I'm an enthusiastic, dedicated software engineer passionate about backend development, networking, and embedded systems. I am currently employed at <a href='https://www.thalesgroup.com/en'>Thales UK</a> and thrive on architecting robust backend solutions, optimizing data transmission, and crafting efficient embedded software. I love tackling complex challenges, collaborating with fellow professionals, and staying up-to-date with tech trends such as my current venture in learning <a href='https://rust-lang.org'>Rust-Lang</a>.",
"skills": [
{
"name": "Rust",
"logo": "devicon-rust-plain",
"colour": "bg-orange-400",
"link": "https://rust-lang.org",
"about": "Rust combines safety, efficiency, and clean code, making it a powerful choice for reliable software development.",
"competency": 70
},
{
"name": "C++",
"logo": "devicon-cplusplus-plain",
"colour": "bg-blue-400",
"link": "https://cplusplus.com/",
"about": "C++ offers high-level abstractions with low-level control, making it essential for performance-critical applications.",
"competency": 80
},
{
"name" : "Python",
"logo": "devicon-python-plain",
"colour": "bg-yellow-400",
"link": "https://python.org",
"about": "Python is a versatile language known for its simplicity and readability, making it ideal for rapid development and data analysis.",
"competency": 70
},
{
"name": "Git",
"logo": "devicon-git-plain",
"colour": "bg-red-400",
"link": "https://git-scm.com",
"about": "Git is an essential tool for version control, enabling efficient collaboration and streamlined code management.",
"competency": 80
},
{
"name": "Docker",
"logo": "devicon-docker-plain",
"colour": "bg-blue-500",
"link": "https://docker.com",
"about": "Docker simplifies deployment by packaging applications in lightweight containers, ensuring consistency across environments.",
"competency": 100
},
{
"name": "Kubernetes",
"logo": "devicon-kubernetes-plain",
"colour": "bg-blue-600",
"link": "https://kubernetes.io",
"about": "Kubernetes automates the deployment, scaling, and management of containerized applications, enhancing operational efficiency.",
"competency": 40
},
{
"name": "PostgreSQL",
"logo": "devicon-postgresql-plain",
"colour": "bg-blue-700",
"link": "https://postgresql.org",
"about": "PostgreSQL is a powerful, open-source relational database known for its robustness and advanced features.",
"competency": 70
},
{
"name": "MongoDB",
"logo": "devicon-mongodb-plain",
"colour": "bg-green-500",
"link": "https://mongodb.com",
"about": "MongoDB is a NoSQL database that provides flexibility and scalability for modern applications with unstructured data.",
"competency": 70
},
{
"name": "Redis",
"logo": "devicon-redis-plain",
"colour": "bg-red-600",
"link": "https://redis.io",
"about": "Redis is an in-memory data structure store, used as a database, cache, and message broker for high-performance applications.",
"competency": 30
},
{
"name": "JavaScript",
"logo": "devicon-javascript-plain",
"colour": "bg-yellow-500",
"link": "https://javascript.com",
"about": "JavaScript is a versatile language that powers dynamic web applications and enhances user interactivity.",
"competency": 60
},
{
"name": "Tailwind CSS",
"logo": "devicon-tailwindcss-plain",
"colour": "bg-blue-800",
"link": "https://tailwindcss.com/",
"about": "Tailwind CSS is a utility-first CSS framework that enables rapid UI development with a focus on customization and responsiveness.",
"competency": 60
},
{
"name": "Svelte",
"logo": "devicon-svelte-plain",
"colour": "bg-orange-400",
"link": "https://svelte.dev",
"about": "Svelte compiles to optimized JavaScript, offering a fast, efficient, and maintainable front-end development experience.",
"competency": 55
}
],
"timeline" : [
{
"duration" : "April 2025 - Present",
"title" : "Thales UK (DDCC) - Software Engineer",
"description" : "As a 3rd year apprentice at Thales UK’s Digital Data Competency Centre, I have taken on responsibility for developing microservices that encapsulate Machine Learning models provided by R&D teams, helping to advance product readiness. These services are primarily written in Python and deployed to Kubernetes clusters for use across the business. Our team also designs and maintains CI/CD pipelines to automate the deployment of both these services and their supporting infrastructure."
},
{
"duration" : "September 2022 - April 2025",
"title" : "Thales UK (ISR) - Software Engineer",
"description" : "As a software engineering apprentice at Thales UK, Intelligence Surveillance and Reconnaissance, I worked within an agile team of six engineers, contributing to the ongoing development of a C++ system for the MOD. My role involved collaborating closely with colleagues, following Scrum methodologies, and leveraging internal frameworks to enhance and maintain the existing platform."
},
{
"duration" : "September 2022 - Present",
"title" : "University of Warwick - Digital and Technology Solutions",
"description" : "The apprenticeship includes allocated time for studying a Digital and Thechnology Solutions degree with the University of Warwick, including modules relevant to business management, devlopment processes and data integrity etc..."
},
{
"duration" : "September 2020 - July 2022",
"title" : "The Norton Knatchbull School (A-Levels)",
"description" : "Computer Science (<b>A*</b>) <br /> Mathematics (<b>A</b>) <br /> Physics (<b>A</b>)"
},
{
"duration" : "September 2015 - July 2020",
"title" : "The Norton Knatchbull School (GCSEs)",
"description" : "Computer Science (<b>9</b>) <br /> Physics (<b>9</b>) <br /> Chemistry (<b>9</b>) <br /> Biology (<b>9</b>) <br /> Geography (<b>9</b>) <br /> FSMQ (C) <br /> Maths (8) <br /> Spanish (7) <br /> English (Literature & Language) (7, 7) <br />"
}
]
{
"name": "Luke Else",
"job_title": "Software Engineer",
"location": "Crawley, Sussex <br /> UK",
"profile_photo": "/profile.jpg",
"about": "Hello! I'm an enthusiastic, dedicated software engineer passionate about backend development, networking, and embedded systems. I am currently employed at <a href='https://www.thalesgroup.com/en'>Thales UK</a> and thrive on architecting robust backend solutions, optimizing data transmission, and crafting efficient embedded software. I love tackling complex challenges, collaborating with fellow professionals, and staying up-to-date with tech trends such as my current venture in learning <a href='https://rust-lang.org'>Rust-Lang</a>.",
"skills": [
{
"name": "Rust",
"logo": "devicon-rust-plain",
"colour": "bg-orange-400",
"link": "https://rust-lang.org",
"about": "Rust combines safety, efficiency, and clean code, making it a powerful choice for reliable software development.",
"competency": 70
},
{
"name": "C++",
"logo": "devicon-cplusplus-plain",
"colour": "bg-blue-400",
"link": "https://cplusplus.com/",
"about": "C++ offers high-level abstractions with low-level control, making it essential for performance-critical applications.",
"competency": 80
},
{
"name" : "Python",
"logo": "devicon-python-plain",
"colour": "bg-yellow-400",
"link": "https://python.org",
"about": "Python is a versatile language known for its simplicity and readability, making it ideal for rapid development and data analysis.",
"competency": 70
},
{
"name": "Git",
"logo": "devicon-git-plain",
"colour": "bg-red-400",
"link": "https://git-scm.com",
"about": "Git is an essential tool for version control, enabling efficient collaboration and streamlined code management.",
"competency": 80
},
{
"name": "Docker",
"logo": "devicon-docker-plain",
"colour": "bg-blue-500",
"link": "https://docker.com",
"about": "Docker simplifies deployment by packaging applications in lightweight containers, ensuring consistency across environments.",
"competency": 100
},
{
"name": "Kubernetes",
"logo": "devicon-kubernetes-plain",
"colour": "bg-blue-600",
"link": "https://kubernetes.io",
"about": "Kubernetes automates the deployment, scaling, and management of containerized applications, enhancing operational efficiency.",
"competency": 40
},
{
"name": "PostgreSQL",
"logo": "devicon-postgresql-plain",
"colour": "bg-blue-700",
"link": "https://postgresql.org",
"about": "PostgreSQL is a powerful, open-source relational database known for its robustness and advanced features.",
"competency": 70
},
{
"name": "MongoDB",
"logo": "devicon-mongodb-plain",
"colour": "bg-green-500",
"link": "https://mongodb.com",
"about": "MongoDB is a NoSQL database that provides flexibility and scalability for modern applications with unstructured data.",
"competency": 70
},
{
"name": "Redis",
"logo": "devicon-redis-plain",
"colour": "bg-red-600",
"link": "https://redis.io",
"about": "Redis is an in-memory data structure store, used as a database, cache, and message broker for high-performance applications.",
"competency": 30
},
{
"name": "JavaScript",
"logo": "devicon-javascript-plain",
"colour": "bg-yellow-500",
"link": "https://javascript.com",
"about": "JavaScript is a versatile language that powers dynamic web applications and enhances user interactivity.",
"competency": 60
},
{
"name": "Tailwind CSS",
"logo": "devicon-tailwindcss-plain",
"colour": "bg-blue-800",
"link": "https://tailwindcss.com/",
"about": "Tailwind CSS is a utility-first CSS framework that enables rapid UI development with a focus on customization and responsiveness.",
"competency": 60
},
{
"name": "Svelte",
"logo": "devicon-svelte-plain",
"colour": "bg-orange-400",
"link": "https://svelte.dev",
"about": "Svelte compiles to optimized JavaScript, offering a fast, efficient, and maintainable front-end development experience.",
"competency": 55
}
],
"timeline" : [
{
"duration" : "April 2025 - Present",
"title" : "Thales UK (DDCC) - Software Engineer",
"description" : "As a 3rd year apprentice at Thales UK’s Digital Data Competency Centre, I have taken on responsibility for developing microservices that encapsulate Machine Learning models provided by R&D teams, helping to advance product readiness. These services are primarily written in Python and deployed to Kubernetes clusters for use across the business. Our team also designs and maintains CI/CD pipelines to automate the deployment of both these services and their supporting infrastructure."
},
{
"duration" : "September 2022 - April 2025",
"title" : "Thales UK (ISR) - Software Engineer",
"description" : "As a software engineering apprentice at Thales UK, Intelligence Surveillance and Reconnaissance, I worked within an agile team of six engineers, contributing to the ongoing development of a C++ system for the MOD. My role involved collaborating closely with colleagues, following Scrum methodologies, and leveraging internal frameworks to enhance and maintain the existing platform."
},
{
"duration" : "September 2022 - Present",
"title" : "University of Warwick - Digital and Technology Solutions",
"description" : "The apprenticeship includes allocated time for studying a Digital and Thechnology Solutions degree with the University of Warwick, including modules relevant to business management, devlopment processes and data integrity etc..."
},
{
"duration" : "September 2020 - July 2022",
"title" : "The Norton Knatchbull School (A-Levels)",
"description" : "Computer Science (<b>A*</b>) <br /> Mathematics (<b>A</b>) <br /> Physics (<b>A</b>)"
},
{
"duration" : "September 2015 - July 2020",
"title" : "The Norton Knatchbull School (GCSEs)",
"description" : "Computer Science (<b>9</b>) <br /> Physics (<b>9</b>) <br /> Chemistry (<b>9</b>) <br /> Biology (<b>9</b>) <br /> Geography (<b>9</b>) <br /> FSMQ (C) <br /> Maths (8) <br /> Spanish (7) <br /> English (Literature & Language) (7, 7) <br />"
}
]
}

20
svelte.config.js
View File

@@ -1,10 +1,10 @@
// import adapter from '@sveltejs/adapter-auto';
import adapter from '@sveltejs/adapter-node';
import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';
const config = {
preprocess: vitePreprocess(),
kit: { adapter: adapter() }
};
export default config;
// import adapter from '@sveltejs/adapter-auto';
import adapter from '@sveltejs/adapter-node';
import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';
const config = {
preprocess: vitePreprocess(),
kit: { adapter: adapter() }
};
export default config;

36
tsconfig.json
View File

@@ -1,18 +1,18 @@
{
"extends": "./.svelte-kit/tsconfig.json",
"compilerOptions": {
"allowJs": true,
"checkJs": true,
"esModuleInterop": true,
"forceConsistentCasingInFileNames": true,
"resolveJsonModule": true,
"skipLibCheck": true,
"sourceMap": true,
"strict": true,
"moduleResolution": "bundler"
}
// Path aliases are handled by https://kit.svelte.dev/docs/configuration#alias
//
// If you want to overwrite includes/excludes, make sure to copy over the relevant includes/excludes
// from the referenced tsconfig.json - TypeScript does not merge them in
}
{
"extends": "./.svelte-kit/tsconfig.json",
"compilerOptions": {
"allowJs": true,
"checkJs": true,
"esModuleInterop": true,
"forceConsistentCasingInFileNames": true,
"resolveJsonModule": true,
"skipLibCheck": true,
"sourceMap": true,
"strict": true,
"moduleResolution": "bundler"
}
// Path aliases are handled by https://kit.svelte.dev/docs/configuration#alias
//
// If you want to overwrite includes/excludes, make sure to copy over the relevant includes/excludes
// from the referenced tsconfig.json - TypeScript does not merge them in
}

20
vite.config.ts
View File

@@ -1,10 +1,10 @@
import { sveltekit } from '@sveltejs/kit/vite';
import { defineConfig } from 'vite';
import tailwindcss from '@tailwindcss/vite';
export default defineConfig({
plugins: [
tailwindcss(),
sveltekit(),
]
});
import { sveltekit } from '@sveltejs/kit/vite';
import { defineConfig } from 'vite';
import tailwindcss from '@tailwindcss/vite';
export default defineConfig({
plugins: [
tailwindcss(),
sveltekit(),
]
});