Skip to content

Instantly share code, notes, and snippets.

View Atinux's full-sized avatar

Sébastien Chopin Atinux

View GitHub Profile
@Atinux
Atinux / nuxt.config.ts
Created April 21, 2023 10:55
Nuxt Home - Route Rules
View nuxt.config.ts
export default defineNuxtConfig({
routeRules: {
// Homepage pre-rendered at build time
'/': { prerender: true },
// Product page generated on-demand, revalidates in background
'/products/**': { swr: true },
// Blog post generated on-demand once until next deploy
'/blog/**': { isr: true },
// Admin dashboard renders only on client-side
'/admin/**': { ssr: false },
@Atinux
Atinux / app.vue
Created April 21, 2023 10:42
Nuxt home - SFC
View app.vue
<script setup>
useSeoMeta({
title: 'Meet Nuxt',
description: 'The Vue Framework for Web Architects.'
})
</script>
<template>
<div id="app">
<AppHeader />
@Atinux
Atinux / example.md
Created April 21, 2023 09:57
test multiple files
View example.md

Markdown file

@Atinux
Atinux / sse.ts
Last active February 16, 2024 18:06
SSE endpoint example with Nuxt 3
View sse.ts
// ~/server/api/sse.ts
export default defineEventHandler(async (event) => {
if (!process.dev) return { disabled: true }
// Enable SSE endpoint
setHeader(event, 'cache-control', 'no-cache')
setHeader(event, 'connection', 'keep-alive')
setHeader(event, 'content-type', 'text/event-stream')
setResponseStatus(event, 200)
View [component].vue
<template>
<UCard v-if="component" class="relative flex flex-col lg:h-[calc(100vh-10rem)]" body-class="px-4 py-5 sm:p-6 relative" footer-class="flex flex-col flex-1 overflow-hidden">
<div class="flex justify-center">
<component :is="`U${defaultProps[params.component].component.name}`" v-if="defaultProps[params.component] && defaultProps[params.component].component" v-bind="defaultProps[params.component].component.props" />
<component :is="is" v-bind="{ ...boundProps, ...eventProps }">
<template v-for="[key, slot] of Object.entries(defaultProps[params.component]?.slots || {}) || []" #[key]>
<template v-if="Array.isArray(slot)">
<div :key="key">
<component
View timeago.vue
<template>
<time :datetime="date" :title="date">{{ timeago }}</time>
</template>
<script>
const units = [
{ max: 2760000, value: 60000, name: 'minute', short: 'm', past: 'a minute ago', future: 'in a minute' },
{ max: 72000000, value: 3600000, name: 'hour', short: 'h', past: 'an hour ago', future: 'in an hour' },
{ max: 518400000, value: 86400000, name: 'day', short: 'd', past: 'yesterday', future: 'tomorrow' },
{ max: 2419200000, value: 604800000, name: 'week', short: 'w', past: 'last week', future: 'in a week' },
@Atinux
Atinux / keybindings.json
Last active January 16, 2022 05:43
VS Code Terminal Shortcuts
View keybindings.json
[
{
"key": "ctrl+shift+n",
"command": "workbench.action.terminal.new"
},
{
"key": "ctrl+shift+right",
"command": "workbench.action.terminal.focusNext"
},
{
View login-url
https://github.com/login/oauth/authorize?client_id=55440d3936ba0961241e
View workshop-token
?access_token=5f73077695f6d2b1d5d0ae4f2277919639838932
@Atinux
Atinux / async-foreach.js
Last active October 10, 2023 03:04
JavaScript: async/await with forEach()
View async-foreach.js
const waitFor = (ms) => new Promise(r => setTimeout(r, ms))
const asyncForEach = async (array, callback) => {
for (let index = 0; index < array.length; index++) {
await callback(array[index], index, array)
}
}
const start = async () => {
await asyncForEach([1, 2, 3], async (num) => {
await waitFor(50)