Skip to content

Commit cae5a00

Browse files
authored
feat: enhance documentation and performance optimizations (#464)
- Added Lighthouse CI configuration for performance monitoring. - Updated Docusaurus configuration with SEO metadata and resource hints for improved loading times. - Introduced structured data for better search engine visibility. - Created new documentation pages for Getting Started, Key Features, and Squads to enhance user onboarding. - Implemented service worker registration for offline capabilities and improved caching strategies. - Optimized CSS for critical rendering and lazy loading of non-essential resources. - Updated package versions and dependencies for better performance and stability.
1 parent a3669ef commit cae5a00

File tree

20 files changed

+9812
-3829
lines changed

20 files changed

+9812
-3829
lines changed

.lighthouserc.js

Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
module.exports = {
2+
ci: {
3+
collect: {
4+
url: ['http://localhost:3000/', 'http://localhost:3000/docs/intro'],
5+
startServerCommand: 'npm run serve',
6+
numberOfRuns: 3,
7+
},
8+
assert: {
9+
assertions: {
10+
'categories:performance': ['error', {minScore: 0.8}],
11+
'categories:accessibility': ['error', {minScore: 0.9}],
12+
'categories:best-practices': ['error', {minScore: 0.9}],
13+
'categories:seo': ['error', {minScore: 0.9}],
14+
'categories:pwa': ['error', {minScore: 0.8}],
15+
16+
// Core Web Vitals
17+
'first-contentful-paint': ['error', {maxNumericValue: 2000}],
18+
'largest-contentful-paint': ['error', {maxNumericValue: 2500}],
19+
'first-input-delay': ['error', {maxNumericValue: 100}],
20+
'cumulative-layout-shift': ['error', {maxNumericValue: 0.1}],
21+
'speed-index': ['error', {maxNumericValue: 3000}],
22+
'interactive': ['error', {maxNumericValue: 3000}],
23+
24+
// Resource optimization
25+
'unused-css-rules': ['error', {maxNumericValue: 20000}],
26+
'unused-javascript': ['error', {maxNumericValue: 20000}],
27+
'unminified-css': 'error',
28+
'unminified-javascript': 'error',
29+
'render-blocking-resources': ['error', {maxNumericValue: 500}],
30+
31+
// Image optimization
32+
'modern-image-formats': 'error',
33+
'uses-optimized-images': 'error',
34+
'uses-responsive-images': 'error',
35+
'offscreen-images': 'error',
36+
37+
// Caching
38+
'uses-long-cache-ttl': 'error',
39+
'efficient-animated-content': 'error',
40+
41+
// JavaScript optimization
42+
'legacy-javascript': 'error',
43+
'uses-text-compression': 'error',
44+
45+
// Preloading
46+
'uses-rel-preload': 'error',
47+
'uses-rel-preconnect': 'error',
48+
},
49+
},
50+
upload: {
51+
target: 'temporary-public-storage',
52+
},
53+
},
54+
};

docs/getting-started/index.md

Lines changed: 164 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,164 @@
1+
---
2+
sidebar_position: 0
3+
sidebar_label: Getting Started Overview
4+
title: Getting Started with daily.dev - Complete Guide
5+
description: "Start your daily.dev journey with this complete guide covering installation, setup, and first steps to build your personalized developer news feed."
6+
keywords: ["daily.dev", "getting started", "installation", "setup", "developer news", "browser extension", "PWA"]
7+
---
8+
9+
# Getting Started with daily.dev
10+
11+
Welcome to daily.dev! This comprehensive guide will help you get started with the platform and make the most of your developer news experience. Whether you're a seasoned developer or just starting your journey, daily.dev provides a personalized, curated feed of the latest tech news and articles.
12+
13+
## What is daily.dev?
14+
15+
daily.dev is a professional network for developers that aggregates content from over 1,300 tech news sources, presenting them in a single, customizable feed. Our platform helps you:
16+
17+
- **Stay informed** with the latest tech trends and news
18+
- **Save time** by accessing curated, high-quality content
19+
- **Build habits** with integrated reading experiences
20+
- **Connect** with other developers in the community
21+
- **Grow professionally** through continuous learning
22+
23+
## Quick Start Journey
24+
25+
### Step 1: Choose Your Platform
26+
Begin your daily.dev experience by selecting the best platform for your needs:
27+
28+
<div className="card-container" style={{ display: 'grid', gridTemplateColumns: 'repeat(auto-fit, minmax(300px, 1fr))', gap: '20px', marginBottom: '30px' }}>
29+
<div className="card">
30+
<div className="card__header">
31+
<h3>🚀 Browser Extension (Recommended)</h3>
32+
</div>
33+
<div className="card__body">
34+
<p>Transform your new tab into a productivity hub with daily.dev. Perfect for building a daily reading habit.</p>
35+
<ul>
36+
<li>✅ Available for Chrome & Edge</li>
37+
<li>✅ New tab integration</li>
38+
<li>✅ Companion widget</li>
39+
<li>✅ Shortcuts support</li>
40+
</ul>
41+
</div>
42+
<div className="card__footer">
43+
<a href="/docs/getting-started/browser-extension-installation" className="button button--primary">Install Extension</a>
44+
</div>
45+
</div>
46+
47+
<div className="card">
48+
<div className="card__header">
49+
<h3>📱 Progressive Web App (PWA)</h3>
50+
</div>
51+
<div className="card__body">
52+
<p>Access daily.dev from any browser with our feature-rich web application. Great for all browsers and mobile devices.</p>
53+
<ul>
54+
<li>✅ Works on all browsers</li>
55+
<li>✅ Mobile-friendly</li>
56+
<li>✅ Offline capabilities</li>
57+
<li>✅ App-like experience</li>
58+
</ul>
59+
</div>
60+
<div className="card__footer">
61+
<a href="/docs/getting-started/pwa" className="button button--secondary">Try PWA</a>
62+
</div>
63+
</div>
64+
</div>
65+
66+
### Step 2: Initial Setup & Personalization
67+
Once you've chosen your platform, the next crucial step is personalizing your experience:
68+
69+
#### Account Creation
70+
- **Sign up** using GitHub, Google, or email
71+
- **Complete your profile** to unlock full features
72+
- **Set preferences** for notifications and privacy
73+
74+
#### Feed Customization
75+
Your feed is the heart of your daily.dev experience. Learn how to:
76+
- **Filter content** by programming languages, topics, and sources
77+
- **Block irrelevant** tags and sources
78+
- **Use advanced filtering** for precise content curation
79+
80+
[👉 **Complete Feed Setup Guide**](/docs/setting-up-your-feed/filtering-content-feed)
81+
82+
### Step 3: Discover Core Features
83+
Explore the powerful features that make daily.dev unique:
84+
85+
#### Essential Features to Try First:
86+
- **[Bookmarks](/docs/key-features/bookmarks)** - Save articles for later reading
87+
- **[Search](/docs/key-features/search)** - Find specific content quickly
88+
- **[Discussions](/docs/key-features/discussions)** - Engage with the community
89+
- **[Upvotes](/docs/key-features/upvotes)** - Show appreciation for quality content
90+
91+
#### Advanced Features:
92+
- **[Community Picks](/docs/key-features/community-picks)** - Discover trending content
93+
- **[Feeds](/docs/key-features/feeds)** - Understand different feed types
94+
- **[Pause New Tab](/docs/key-features/pause-new-tab)** - Control your browsing experience
95+
96+
### Step 4: Build Your Developer Profile
97+
Transform your reading activity into professional growth:
98+
99+
#### Profile Setup:
100+
- **[Activity Tracking](/docs/your-profile/activity)** - Monitor your reading progress
101+
- **[Reputation System](/docs/your-profile/reputation)** - Build credibility in the community
102+
- **[Weekly Goals](/docs/your-profile/weekly-goal)** - Set and achieve reading targets
103+
- **[DevCard](/docs/your-profile/devcard)** - Showcase your learning journey
104+
105+
#### Community Engagement:
106+
- **Join discussions** on articles that interest you
107+
- **Share insights** and learn from other developers
108+
- **Follow topics** that align with your career goals
109+
110+
### Step 5: Customize Your Experience
111+
Make daily.dev truly yours with extensive customization options:
112+
113+
#### Visual Customization:
114+
- **[Theme Selection](/docs/customize-your-feed/theme)** - Choose from multiple themes
115+
- **[Layout Options](/docs/customize-your-feed/layout)** - Optimize for your screen
116+
- **[Card Density](/docs/customize-your-feed/density)** - Control information density
117+
- **[Preferences](/docs/customize-your-feed/preferences)** - Fine-tune your experience
118+
119+
## Getting Started Resources
120+
121+
### For New Users
122+
<div className="alert alert--info">
123+
<strong>💡 Pro Tip:</strong> Start with the browser extension and spend 5-10 minutes daily browsing your feed to build a consistent learning habit.
124+
</div>
125+
126+
### Essential First Steps Checklist:
127+
- [ ] Install daily.dev (extension or PWA)
128+
- [ ] Create your account and complete profile
129+
- [ ] Set up your personalized feed filters
130+
- [ ] Bookmark your first article
131+
- [ ] Engage with one discussion
132+
- [ ] Customize your theme and layout
133+
- [ ] Set your weekly reading goal
134+
135+
### Troubleshooting Common Issues
136+
Having trouble getting started? Check these common solutions:
137+
138+
#### Installation Issues:
139+
- **Extension not working?** Ensure you've granted all necessary permissions
140+
- **PWA not loading?** Try clearing browser cache and cookies
141+
- **Login problems?** Verify your email or try alternative sign-in methods
142+
143+
#### Content Issues:
144+
- **Feed empty?** Check your filters - they might be too restrictive
145+
- **Irrelevant content?** Spend time fine-tuning your tag and source preferences
146+
- **Loading slowly?** Try switching to a different layout or adjusting density
147+
148+
## What's Next?
149+
150+
Once you're comfortable with the basics, explore these advanced features:
151+
152+
153+
## Need Help?
154+
155+
### Community Support
156+
- **Join our Discord** - Get real-time help from the community
157+
- **Contact Support** - Reach out to our team for technical issues
158+
- **Browse Documentation** - Find detailed guides for every feature
159+
160+
### Quick Links
161+
- [Browser Extension Installation](/docs/getting-started/browser-extension-installation)
162+
- [PWA Setup Guide](/docs/getting-started/pwa)
163+
- [Feed Customization](/docs/setting-up-your-feed/filtering-content-feed)
164+
- [Community Guidelines](/docs/community)

docs/key-features/discussions.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,7 @@ We only support pure markdown in comments, HTML will be converted to plain text.
6565
:::
6666

6767
## Comment sorting (Enjoy comments periodically)
68-
![Sorting](https://res.cloudinary.com/daily-now/image/upload/s--iBD2ASDp--/f_auto/v1728388274/posts/GmJxoDsta)
68+
![daily.dev comment sorting interface showing dropdown options for latest and oldest comments with sorting controls](https://res.cloudinary.com/daily-now/image/upload/s--iBD2ASDp--/f_auto/v1728388274/posts/GmJxoDsta)
6969
### See latest and oldest comments easily.
7070

7171
Now it becomes easier to see which comment is the oldest and which are the newest to check the hotness of the discussion topic.

0 commit comments

Comments
 (0)