Elizhium/litlyx
1
0
Fork 0
mirror of https://github.com/Litlyx/litlyx synced 2025-12-10 07:48:37 +01:00
Code Issues Packages Projects Releases Wiki Activity

add blog

Browse Source
This commit is contained in:
Emily
2024-07-16 18:02:17 +02:00
parent 669898986b
commit 5c8f173600
8 changed files with 374 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
landing/blog/Blog.ts Normal file
View File

@@ -0,0 +1,29 @@
export type BlogPost = {
author: string,
authorImage: string,
created_at: string,
image: string,
title: string,
subtitle: string,
id: string
}
export const homePostsIndexes = ref<number[]>([
0
])
export const blogPosts = ref<BlogPost[]>([
{
author: 'Antonio, CEO at Litlyx',
authorImage: 'AntonioVerdiglione.jpg',
image: 'posts/presenting-litlyx.jpg',
created_at: "Jul 16, 2024",
title: 'Presenting Litlyx',
subtitle: 'Our Why. Our Vision. Our Manifestation of Intent',
id: 'presenting-litlyx'
}
]);
export const homePosts = computed(() => {
return blogPosts.value.filter((e, i) => homePostsIndexes.value.includes(i));
})

58
landing/components/blog/ArticleWrapper.vue Normal file
View File

@@ -0,0 +1,58 @@
<script lang="ts" setup>
import { blogPosts } from '~/blog/Blog';
definePageMeta({ layout: 'header' });
const route = useRoute();
const id = route.path.replace('/blog/', '');
const blogPost = blogPosts.value.find(e => e.id == id);
</script>
<template>
<div class="article flex justify-center">
<article class="max-w-[1000px]">
<header>
<div class="flex flex-col items-center">
<h1 class="text-6xl font-normal">
{{ blogPost?.title }}
</h1>
<p class="italic mt-3 text-2xl">
{{ blogPost?.subtitle }}
</p>
<div class="flex items-center gap-2">
<img class="w-9 h-9 rounded-full" :src="blogPost?.authorImage" :alt="blogPost?.author">
<p class="align-middle mt-4">
{{ blogPost?.author }}
</p>
<span class="text-gray-400"> • {{ blogPost?.created_at }}</span>
</div>
</div>
<img class="w-full h-full rounded-xl outline outline-[1px] outline-gray-100/20 mt-10 mb-10"
:src="blogPost?.image" :alt="blogPost?.title">
</header>
<slot></slot>
</article>
</div>
</template>
<style scoped>
.article * {
font-family: 'Poppins', sans-serif;
}
article {
margin: 2rem;
}
header,
section,
footer {
margin-bottom: 2rem;
}
p {
margin-bottom: 1rem;
}
</style>

39
landing/layouts/header.vue
View File

@@ -33,6 +33,9 @@ nuxtApp.hook("page:finish", () => {
<div class="grow"></div>
<div class="flex gap-8 text-[1.1rem] text-white font-[500]">
<NuxtLink to="https://litlyx.com/blog" class="poppins hover:text-text-sub/90">
Blog
</NuxtLink>
<NuxtLink target="_blank" to="https://dashboard.litlyx.com/live_demo"
class="poppins hover:text-text-sub/90">
Live demo
@@ -40,12 +43,12 @@ nuxtApp.hook("page:finish", () => {
<NuxtLink target="_blank" to="https://docs.litlyx.com" class="poppins hover:text-text-sub/90">
Docs
</NuxtLink>
<NuxtLink to="/pricing" class="poppins hover:text-text-sub/90">
Pricing
</NuxtLink>
<NuxtLink target="_blank" to="https://github.com/Litlyx/litlyx" class="poppins hover:text-text-sub/90">
GitHub
</NuxtLink>
<NuxtLink to="/pricing" class="poppins hover:text-text-sub/90">
Pricing
</NuxtLink>
</div>
<div class="px-10 pt-6 lg:pt-0">
<NuxtLink to="https://dashboard.litlyx.com" target="_blank"
@@ -90,6 +93,16 @@ nuxtApp.hook("page:finish", () => {
</div>
<NuxtLink to="https://litlyx.com/blog"
class="flex justify-between items-center mr-2">
<div class="hover:text-text-sub/90 py-3">
Blog
</div>
<div> <i class="fas fa-chevron-right"></i> </div>
</NuxtLink>
<div class="divider border-b border-gray-500/40"></div>
<NuxtLink target="_blank" to="https://docs.litlyx.com"
class="flex justify-between items-center mr-2">
<div class="hover:text-text-sub/90 py-3">
@@ -100,6 +113,16 @@ nuxtApp.hook("page:finish", () => {
<div class="divider border-b border-gray-500/40"></div>
<NuxtLink target="_blank" to="https://github.com/Litlyx/litlyx"
class="flex justify-between items-center mr-2">
<div class="hover:text-text-sub/90 py-3"> GitHub </div>
<div> <i class="fas fa-chevron-right"></i> </div>
</NuxtLink>
<div class="divider border-b border-gray-500/40"></div>
<NuxtLink @click="isMenuOpen = false" to="/pricing" class="flex justify-between items-center mr-2">
<div class="hover:text-text-sub/90 py-3">
Pricing
@@ -107,13 +130,6 @@ nuxtApp.hook("page:finish", () => {
<div> <i class="fas fa-chevron-right"></i> </div>
</NuxtLink>
<div class="divider border-b border-gray-500/40"></div>
<NuxtLink target="_blank" to="https://github.com/Litlyx/litlyx"
class="flex justify-between items-center mr-2">
<div class="hover:text-text-sub/90 py-3"> GitHub </div>
<div> <i class="fas fa-chevron-right"></i> </div>
</NuxtLink>
<div class="divider border-b border-gray-500/40"></div>
@@ -164,11 +180,12 @@ nuxtApp.hook("page:finish", () => {
<div class="text-text-sub/60 font-semibold text-[1.3rem]"> Product </div>
<NuxtLink to="/pricing" class="hover:text-accent cursor-pointer"> Pricing </NuxtLink>
<NuxtLink to="/blog" class="hover:text-accent cursor-pointer"> Blog </NuxtLink>
<NuxtLink target="_blank" to="https://docs.litlyx.com" class="hover:text-accent cursor-pointer">
Docs </NuxtLink>
<NuxtLink target="_blank" to="https://github.com/Litlyx/litlyx"
class="hover:text-accent cursor-pointer"> Github </NuxtLink>
<NuxtLink to="/pricing" class="hover:text-accent cursor-pointer"> Pricing </NuxtLink>
</div>
<div class="flex flex-col gap-4">
<div class="text-text-sub/60 font-semibold text-[1.3rem]"> Company </div>

76
landing/pages/blog/index.vue Normal file
View File

@@ -0,0 +1,76 @@
<script lang="ts" setup>
definePageMeta({ layout: 'header' });
import { blogPosts, homePosts } from '~/blog/Blog';
</script>
<template>
<div class="blog-home h-full flex justify-center overflow-y-auto">
<div class="flex flex-col gap-6 px-6 py-6 max-w-[1200px]">
<div>
<h1> Blog </h1>
</div>
<div class="home-posts flex gap-10 justify-center">
<NuxtLink tag="article" :to="post.id" v-for="post of homePosts" class="flex flex-col gap-2">
<img class="w-full h-full rounded-xl outline outline-[1px] outline-gray-100/20" :src="post.image"
:alt="post.title">
<h4 class="font-normal mt-2"> {{ post.title }} </h4>
<div class="flex gap-3 items-center text-[1rem]">
<img class="w-9 h-9 rounded-full" :src="post.authorImage" :alt="post.author">
<div class="font-normal"> {{ post.author }} </div>
<div class="text-gray-400"> • {{ post.created_at }} </div>
</div>
</NuxtLink>
</div>
<h5 class="mt-12"> Latest posts </h5>
<div class="grid grid-cols-3 gap-2">
<NuxtLink tag="article" :to="post.id" v-for="post of blogPosts" class="flex flex-col gap-2">
<img class="rounded-xl outline outline-[1px] outline-gray-100/20" :src="post.image"
:alt="post.title">
<h5 class="font-normal mt-2"> {{ post.title }} </h5>
<div class="flex gap-3 items-center text-[.9rem]">
<img class="w-8 h-8 rounded-full" :src="post.authorImage" :alt="post.author">
<div class="font-normal"> {{ post.author }} </div>
<div class="text-gray-400"> • {{ post.created_at }} </div>
</div>
</NuxtLink>
</div>
<div class="pb-20"></div>
</div>
</div>
</template>
<style scoped lang="scss">
h1 {
font-size: 3rem;
}
h4 {
font-size: 1.75rem;
}
h5 {
font-size: 1.5rem;
}
h6 {
font-size: 1.25rem;
}
.blog-home * {
font-family: "Poppins"
}
</style>

138
landing/pages/blog/presenting-litlyx.vue Normal file
View File

@@ -0,0 +1,138 @@
<script lang="ts" setup>
definePageMeta({ layout: 'header' });
import { blogPosts } from '~/blog/Blog';
definePageMeta({ layout: 'header' });
const route = useRoute();
const id = route.path.replace('/blog/', '');
const blogPost = blogPosts.value.find(e => e.id == id);
useSeoMeta({
title: () => `Litlyx Blog - ${blogPost?.title}`,
ogTitle: () => `Litlyx Blog - ${blogPost?.title}`,
description: () => blogPost?.subtitle,
ogDescription: () => blogPost?.subtitle,
keywords: 'Litlyx blog, analytics insights, real-time analytics, AI-powered analytics, data visualization, performance metrics, KPI tracking, custom events, open-source analytics, business intelligence, data trends, developer insights, analytics updates, data-driven decisions, blog updates, tech news, Litlyx updates, analytics best practices',
author: () => blogPost?.author,
ogImage: () => 'https://litlyx.com/blog/posts/' + blogPost?.image,
ogType: 'website',
ogUrl: 'https://litlyx.com/blog',
twitterCard: 'summary_large_image',
twitterTitle: () => `Litlyx Blog - ${blogPost?.title}`,
twitterDescription: () => blogPost?.subtitle,
twitterImage: () => 'https://litlyx.com/blog/posts/' + blogPost?.image,
ogSiteName: 'Litlyx',
ogLocale: 'en_US',
ogImageWidth: '1200',
ogImageHeight: '630'
})
</script>
<template>
<BlogArticleWrapper>
<div>
<section>
<h2 class="text-3xl font-semibold">Why?</h2>
<p>When I was a CTO at one of my previous startups, I faced significant challenges in tracking and
analyzing
metrics effectively. Our team needed <strong>real-time analytics</strong>, yet existing solutions
were
often outdated, expensive, and complicated to set up.</p>
<p>I needed speed. Speed like a Ferrari.</p>
<p>We started working closely with a growth hacking team at that time. With pressure from the CEO and
the
growth team, I had to manage a team of five developers, organize feature implementations, and set up
analytics.</p>
<p>It was rough.</p>
<p>I struggled to get actionable data without a complex setup, and the lack of a <strong>lightweight,
customizable analytics tool</strong> that was fast to implement.</p>
<p>It was a real problem.</p>
<p>Frustrated with the limitations of current analytics solutions, I opted for MixPanel for tracking
custom
events, Google Analytics for tracking visits & superficial metrics, and Clarity for tracking user
behaviors. But… MixPanel required intricate setups for detailed event tracking, Google Analytics
provided robust data on page visits but was hard to configure, and Clarity offered insights into
user
behavior but lacked real-time capabilities. There wasn’t a tool that did it all in one solution nor
was
created for each tech-stack out there.</p>
<p>For this level of complexity in metrics, <strong>developers MUST be involved</strong>. period.</p>
</section>
<section>
<h2 class="text-3xl font-semibold">Why Dev-Centric</h2>
<p>We're building <strong>Litlyx</strong>, an <strong>open-source, lightweight analytics
platform</strong>
designed for simplicity to empower each developer to track analytics within seconds.</p>
<p>Our mission was to achieve a <strong>30-seconds setup</strong> in all tech stacks.</p>
<p><strong>Spoiler Alert: we did!</strong></p>
<p>We needed to create a tool that not only tracks your KPIs but also offers <strong>high
customization</strong>, an <strong>AI data-analyst assistant</strong>, and <strong>comprehensive
analytics report generation</strong>.</p>
<p>Everything about analytics with Litlyx should be Exceptionally Easy and Fast.</p>
<p>Devs should be focusing on actual Feature implementations and not wasting-time on reading complex
documentations.</p>
</section>
<section>
<h2 class="text-3xl font-semibold">Why now, in 2024?</h2>
<p>The current landscape of <strong>analytics tools</strong> is outdated and fragmented. Most solutions
were
developed over a decade ago, primarily focusing on large enterprises and emphasizing sales-led
growth or
marketing.</p>
<p>These tools often ignore the needs of developers and smaller teams. But they are essential.</p>
<p>No one is prioritizing a <strong>developer-first analytics experience</strong> or innovating in the
analytics space.</p>
<p>The time has come to rethink analytics for 2024 and beyond. We need a tool that aligns with modern
app
development standards and provides a seamless, intuitive, and most importantly, <strong>dev-centric
experience</strong>.</p>
</section>
<section>
<h2 class="text-3xl font-semibold">How the future looks</h2>
<p><strong>Litlyx</strong> aims to be the No.1 tool for analytics tracking that comes to mind for
developers, known for efficiency, simplicity, and cost-effectiveness.</p>
<p>We want to be the <strong>go-to solution for collecting analytics</strong>, reducing fragmentation,
enhancing aggregation, and acting as a connector for databases and analytics tools that people
already
use. Our goal is to be the only place people need for everything related to analytics.</p>
<p>We are committed to being dev-centric always.</p>
</section>
<section>
<h2 class="text-3xl font-semibold">Join us</h2>
<p>The Litlyx Team have taken the responsibility to create the simplest yet most effective way to track
analytics.</p>
<p>We're building something that developers can really love.</p>
<p>We're building it <a href="https://github.com/Litlyx/litlyx"><strong>Open-Source</strong></a>,
because we
trust transparency and we know how much difficult it is to gain control on where your data goes.</p>
<p>Probably we will make some mistakes in the process, but we are humans. We are devs!</p>
<p>Join our journey and be among the pioneer developers to experience analytics tracking with
<strong>Litlyx</strong>.
</p>
</section>
</div>
</BlogArticleWrapper>
</template>
<style scoped>
.article * {
font-family: 'Poppins', sans-serif;
}
article {
margin: 2rem;
}
header,
section,
footer {
margin-bottom: 2rem;
}
p {
margin-bottom: 1rem;
}
</style>

BIN
landing/public/blog/AntonioVerdiglione.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 150 KiB

BIN
landing/public/blog/posts/presenting-litlyx.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 38 KiB

33
landing/public/sitemap.xml
View File

@@ -2,44 +2,49 @@
<urlset
xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://www.sitemaps.org/schemas/sitemap/0.9
http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd">
<url>
xsi:schemaLocation="http://www.sitemaps.org/schemas/sitemap/0.9 http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd">
<url>
<loc>https://litlyx.com/</loc>
<lastmod>2024-07-03T14:44:19+00:00</lastmod>
<changefreq>daily</changefreq>
<priority>1.00</priority>
</url>
<url>
</url>
<url>
<loc>https://litlyx.com/blog</loc>
<lastmod>2024-07-16T10:45:11+00:00</lastmod>
<changefreq>daily</changefreq>
<priority>1.00</priority>
</url>
<url>
<loc>https://litlyx.com/pricing</loc>
<lastmod>2024-07-04T10:45:11+00:00</lastmod>
<changefreq>monthly</changefreq>
<priority>0.80</priority>
</url>
<url>
</url>
<url>
<loc>https://litlyx.com/contacts</loc>
<lastmod>2024-07-04T10:45:11+00:00</lastmod>
<changefreq>monthly</changefreq>
<priority>0.80</priority>
</url>
<url>
</url>
<url>
<loc>https://litlyx.com/privacy</loc>
<lastmod>2024-07-04T10:45:11+00:00</lastmod>
<changefreq>monthly</changefreq>
<priority>0.80</priority>
</url>
<url>
</url>
<url>
<loc>https://litlyx.com/terms</loc>
<lastmod>2024-07-04T10:45:11+00:00</lastmod>
<changefreq>monthly</changefreq>
<priority>0.80</priority>
</url>
<url>
</url>
<url>
<loc>https://litlyx.com/data_policy</loc>
<lastmod>2024-07-04T10:45:11+00:00</lastmod>
<changefreq>monthly</changefreq>
<priority>0.80</priority>
</url>
</url>
</urlset>