devfolio-page 0.2.1 → 0.2.3

package/dist/cli/commands/dev.js

@@ -29,11 +29,37 @@ async function rebuild(file, options) {
         siteCache = result.files;
         console.log();
         console.log(chalk.green('✓') + ` Rebuilt ${result.fileList.length} files in memory`);
+        // Show available pages (HTML only)
+        const htmlFiles = Array.from(siteCache.keys()).filter(key => key.endsWith('.html'));
+        if (htmlFiles.length > 0) {
+            console.log(chalk.dim('  Available pages:'));
+            htmlFiles.forEach((key) => {
+                // Convert file path to route
+                let route = '/' + key.replace(/\.html$/, '').replace(/\/index$/, '');
+                if (route === '/')
+                    route = '/ (home)';
+                console.log(chalk.dim(`    ${route}`));
+            });
+        }
         console.log();
     }
     catch (error) {
         console.error(chalk.red('✗') + ' Build failed:');
-        console.error(error instanceof Error ? error.message : String(error));
+        // Show detailed validation errors if available
+        if (error instanceof Error && 'errors' in error) {
+            const validationError = error;
+            console.error(chalk.red(error.message));
+            console.log();
+            validationError.errors?.forEach((err) => {
+                console.error(chalk.yellow(`  ${err.path}`) + `: ${err.message}`);
+                if (err.hint) {
+                    console.error(chalk.dim(`    Example: ${err.hint}`));
+                }
+            });
+        }
+        else {
+            console.error(error instanceof Error ? error.message : String(error));
+        }
         console.log();
     }
     finally {
@@ -52,16 +78,62 @@ function startServer(port) {
             let filePath = req.url === '/' ? 'index.html' : (req.url || 'index.html');
             // Remove leading slash and query string
             filePath = filePath.replace(/^\//, '').split('?')[0];
-            // Check if file exists in cache
-            if (!siteCache.has(filePath)) {
-                res.writeHead(404);
+            // Debug: log the request
+            console.log(chalk.dim(`\n  Request: ${req.url} → normalized: ${filePath}`));
+            // Try different path variations to find the file
+            let content;
+            let matchedPath;
+            // 1. Try exact path
+            const tryExact = filePath;
+            console.log(chalk.dim(`    [1] Exact: ${tryExact} ${siteCache.has(tryExact) ? chalk.green('✓') : chalk.red('✗')}`));
+            if (siteCache.has(tryExact)) {
+                content = siteCache.get(tryExact);
+                matchedPath = tryExact;
+            }
+            // 2. Try adding .html extension
+            if (!content) {
+                const tryHtml = filePath + '.html';
+                console.log(chalk.dim(`    [2] +.html: ${tryHtml} ${siteCache.has(tryHtml) ? chalk.green('✓') : chalk.red('✗')}`));
+                if (siteCache.has(tryHtml)) {
+                    content = siteCache.get(tryHtml);
+                    matchedPath = tryHtml;
+                }
+            }
+            // 3. Try as directory with index.html
+            if (!content) {
+                const tryDir = filePath + '/index.html';
+                console.log(chalk.dim(`    [3] +/index.html: ${tryDir} ${siteCache.has(tryDir) ? chalk.green('✓') : chalk.red('✗')}`));
+                if (siteCache.has(tryDir)) {
+                    content = siteCache.get(tryDir);
+                    matchedPath = tryDir;
+                }
+            }
+            // 4. Try removing trailing slash and adding index.html
+            if (!content && filePath.endsWith('/')) {
+                const trySlash = filePath + 'index.html';
+                console.log(chalk.dim(`    [4] trailing/: ${trySlash} ${siteCache.has(trySlash) ? chalk.green('✓') : chalk.red('✗')}`));
+                if (siteCache.has(trySlash)) {
+                    content = siteCache.get(trySlash);
+                    matchedPath = trySlash;
+                }
+            }
+            // If still not found, return 404
+            if (!content) {
+                console.log(chalk.dim(`  404: ${req.url}`));
+                res.writeHead(404, { 'Content-Type': 'text/plain' });
                 res.end('Not found');
                 return;
             }
-            // Get file from cache
-            const content = siteCache.get(filePath);
-            // Set content type based on file extension
-            const ext = path.extname(filePath);
+            // Log successful requests (excluding assets)
+            if (matchedPath && matchedPath.endsWith('.html')) {
+                console.log(chalk.dim(`  200: ${req.url}`) + chalk.green(` → ${matchedPath}`));
+            }
+            // Determine content type from original request or file path
+            let ext = path.extname(req.url || '');
+            // If no extension in URL, check if we're serving HTML
+            if (!ext && content) {
+                ext = '.html';
+            }
             const contentTypes = {
                 '.html': 'text/html',
                 '.css': 'text/css',
@@ -82,8 +154,8 @@ function startServer(port) {
             res.end(content);
         }
         catch (error) {
-            console.error('Server error:', error);
-            res.writeHead(500);
+            console.error(chalk.red('✗') + ' Server error:', error);
+            res.writeHead(500, { 'Content-Type': 'text/plain' });
             res.end('Internal server error');
         }
     });
@@ -115,10 +187,37 @@ export async function devCommand(file = 'portfolio.yaml', options = {}) {
         });
         siteCache = result.files;
         console.log(chalk.green('    ✓') + ` Built ${result.fileList.length} files`);
+        console.log();
+        // Show available pages (HTML only)
+        const htmlFiles = Array.from(siteCache.keys()).filter(key => key.endsWith('.html'));
+        if (htmlFiles.length > 0) {
+            console.log(chalk.dim('  Available pages:'));
+            htmlFiles.forEach((key) => {
+                // Convert file path to route
+                let route = '/' + key.replace(/\.html$/, '').replace(/\/index$/, '');
+                if (route === '/')
+                    route = '/ (home)';
+                console.log(chalk.dim(`    ${route}`));
+            });
+        }
     }
     catch (error) {
         console.error(chalk.red('✗') + ' Initial build failed:');
-        console.error(error instanceof Error ? error.message : String(error));
+        // Show detailed validation errors if available
+        if (error instanceof Error && 'errors' in error) {
+            const validationError = error;
+            console.error(chalk.red(error.message));
+            console.log();
+            validationError.errors?.forEach((err) => {
+                console.error(chalk.yellow(`  ${err.path}`) + `: ${err.message}`);
+                if (err.hint) {
+                    console.error(chalk.dim(`    Example: ${err.hint}`));
+                }
+            });
+        }
+        else {
+            console.error(error instanceof Error ? error.message : String(error));
+        }
         process.exit(1);
     }
     // Start server

package/dist/cli/commands/init.js

@@ -35,6 +35,47 @@ function question(rl, prompt) {
         });
     });
 }
+function isValidEmail(email) {
+    const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+    return emailRegex.test(email);
+}
+function isValidUrl(url) {
+    try {
+        const parsed = new URL(url);
+        return parsed.protocol === 'http:' || parsed.protocol === 'https:';
+    }
+    catch {
+        return false;
+    }
+}
+function isValidUsername(username) {
+    // Basic validation: alphanumeric, hyphens, underscores
+    const usernameRegex = /^[a-zA-Z0-9_-]+$/;
+    return usernameRegex.test(username);
+}
+async function questionWithValidation(rl, prompt, validator, optional = false) {
+    while (true) {
+        const answer = await question(rl, prompt);
+        // Allow empty if optional
+        if (!answer && optional) {
+            return '';
+        }
+        // Require value if not optional
+        if (!answer && !optional) {
+            console.log(chalk.red('  ✗ This field is required'));
+            continue;
+        }
+        // Validate if validator provided
+        if (answer && validator) {
+            const result = validator(answer);
+            if (!result.valid) {
+                console.log(chalk.red(`  ✗ ${result.error}`));
+                continue;
+            }
+        }
+        return answer;
+    }
+}
 function printHeader() {
     console.log();
     console.log(chalk.cyan('┌────────────────────────────────────────┐'));
@@ -195,26 +236,15 @@ export async function initCommand() {
             rl.close();
             process.exit(1);
         }
-        const name = await question(rl, chalk.cyan('? ') + 'What\'s your name? ');
-        if (!name) {
-            console.log(chalk.red('✗') + ' Name is required');
-            process.exit(1);
-        }
-        const title = await question(rl, chalk.cyan('? ') + 'What\'s your title/role? ');
-        if (!title) {
-            console.log(chalk.red('✗') + ' Title is required');
-            process.exit(1);
-        }
-        const location = await question(rl, chalk.cyan('? ') + 'Where are you located? ');
-        if (!location) {
-            console.log(chalk.red('✗') + ' Location is required');
-            process.exit(1);
-        }
-        const email = await question(rl, chalk.cyan('? ') + 'What\'s your email? ');
-        if (!email) {
-            console.log(chalk.red('✗') + ' Email is required');
-            process.exit(1);
-        }
+        const name = await questionWithValidation(rl, chalk.cyan('? ') + 'What\'s your name? ');
+        const title = await questionWithValidation(rl, chalk.cyan('? ') + 'What\'s your title/role? ');
+        const location = await questionWithValidation(rl, chalk.cyan('? ') + 'Where are you located? ');
+        const email = await questionWithValidation(rl, chalk.cyan('? ') + 'What\'s your email? ', (value) => {
+            if (!isValidEmail(value)) {
+                return { valid: false, error: 'Invalid email format (example: you@example.com)' };
+            }
+            return { valid: true };
+        });
         // Theme selection
         console.log();
         console.log(chalk.cyan('? ') + 'Which theme would you like?');
@@ -236,10 +266,30 @@ export async function initCommand() {
             console.log(chalk.yellow('  Invalid choice, using SRCL'));
         }
         console.log(chalk.dim('\n  Optional fields (press Enter to skip)'));
-        const github = await question(rl, chalk.cyan('? ') + 'GitHub username? ' + chalk.dim('(optional) '));
-        const linkedin = await question(rl, chalk.cyan('? ') + 'LinkedIn username? ' + chalk.dim('(optional) '));
-        const twitter = await question(rl, chalk.cyan('? ') + 'Twitter username? ' + chalk.dim('(optional) '));
-        const website = await question(rl, chalk.cyan('? ') + 'Website URL? ' + chalk.dim('(optional) '));
+        const github = await questionWithValidation(rl, chalk.cyan('? ') + 'GitHub username? ' + chalk.dim('(optional) '), (value) => {
+            if (!isValidUsername(value)) {
+                return { valid: false, error: 'Invalid username format (letters, numbers, hyphens, underscores only)' };
+            }
+            return { valid: true };
+        }, true);
+        const linkedin = await questionWithValidation(rl, chalk.cyan('? ') + 'LinkedIn username? ' + chalk.dim('(optional) '), (value) => {
+            if (!isValidUsername(value)) {
+                return { valid: false, error: 'Invalid username format (letters, numbers, hyphens, underscores only)' };
+            }
+            return { valid: true };
+        }, true);
+        const twitter = await questionWithValidation(rl, chalk.cyan('? ') + 'Twitter username? ' + chalk.dim('(optional) '), (value) => {
+            if (!isValidUsername(value)) {
+                return { valid: false, error: 'Invalid username format (letters, numbers, hyphens, underscores only)' };
+            }
+            return { valid: true };
+        }, true);
+        const website = await questionWithValidation(rl, chalk.cyan('? ') + 'Website URL? ' + chalk.dim('(optional) '), (value) => {
+            if (!isValidUrl(value)) {
+                return { valid: false, error: 'Invalid URL format (must start with http:// or https://)' };
+            }
+            return { valid: true };
+        }, true);
         rl.close();
         const input = {
             name,
@@ -267,12 +317,12 @@ export async function initCommand() {
         console.log(chalk.dim('  └── ') + chalk.cyan('site/') + chalk.dim('           (generated after render)'));
         console.log();
         console.log(chalk.bold('Next steps:'));
-        console.log(chalk.dim('  1.') + ' Edit ' + chalk.cyan(`${folderName}/portfolio.yaml`) + ' and add your projects');
+        console.log(chalk.dim('  1.') + ' Edit ' + chalk.cyan(`${folderName}/portfolio.yaml`) + ' and add your content');
         console.log(chalk.dim('  2.') + ' Add images to ' + chalk.cyan(`${folderName}/images/`));
-        console.log(chalk.dim('  3.') + ' Run: ' + chalk.cyan(`cd ${folderName} && devfolio-page render`));
-        console.log(chalk.dim('  4.') + ' Open: ' + chalk.cyan(`${folderName}/site/index.html`) + ' to view');
+        console.log(chalk.dim('  3.') + ' Run: ' + chalk.cyan(`cd ${folderName} && devfolio-page dev`));
+        console.log(chalk.dim('  4.') + ' Open: ' + chalk.cyan(`http://localhost:3000`) + ' in your browser');
         console.log();
-        console.log('Tip: Check ' + chalk.cyan('https://devfolio.page/portfolios/') + ' for examples');
+        console.log('Tip: Check ' + chalk.cyan('https://devfolio.page/docs') + ' for full documentation');
         console.log();
     }
     catch (err) {

package/dist/cli/schemas/portfolio.schema.js

@@ -96,8 +96,8 @@ const contentSectionSchema = z.discriminatedUnion('type', [
 const simpleProjectSchema = z.object({
     name: z.string().min(1, 'Project name is required'),
     url: urlString.optional(),
-    description: z.string().min(1, 'Project description is required'),
-    tags: z.array(z.string()).min(1, 'At least one tag is required'),
+    description: z.string().optional(),
+    tags: z.array(z.string()).optional(),
     featured: z.boolean().optional(),
 });
 // Rich project schema (for case studies)
@@ -109,10 +109,10 @@ const richProjectSchema = z.object({
     thumbnail: urlOrPath.optional(),
     hero: urlOrPath.optional(),
     meta: z.object({
-        year: z.union([z.string(), z.number()]),
-        role: z.string().min(1, 'Role is required'),
+        year: z.union([z.string(), z.number()]).optional(),
+        role: z.string().optional(),
         timeline: z.string().optional(),
-        tech: z.array(z.string()).min(1, 'At least one technology is required'),
+        tech: z.array(z.string()).optional(),
         links: z
             .object({
             github: urlString.optional(),
@@ -121,30 +121,30 @@ const richProjectSchema = z.object({
             case_study: urlString.optional(),
         })
             .optional(),
-    }),
-    sections: z.array(contentSectionSchema).min(1, 'At least one section is required'),
+    }).optional(),
+    sections: z.array(contentSectionSchema).optional(),
 });
 // =============================================================================
 // Experience & Education Schemas
 // =============================================================================
 const experienceSchema = z.object({
     company: z.string().min(1, 'Company name is required'),
-    role: z.string().min(1, 'Role is required'),
+    role: z.string().optional(),
     date: z.object({
-        start: dateFormat,
-        end: dateOrPresent,
-    }),
+        start: dateFormat.optional(),
+        end: dateOrPresent.optional(),
+    }).optional(),
     location: z.string().optional(),
     description: z.string().optional(),
-    highlights: z.array(z.string()).min(1, 'At least one highlight is required'),
+    highlights: z.array(z.string()).optional(),
 });
 const educationSchema = z.object({
     institution: z.string().min(1, 'Institution name is required'),
-    degree: z.string().min(1, 'Degree is required'),
+    degree: z.string().optional(),
     date: z.object({
-        start: dateFormat,
-        end: dateFormat,
-    }),
+        start: dateFormat.optional(),
+        end: dateFormat.optional(),
+    }).optional(),
     location: z.string().optional(),
     description: z.string().optional(),
     highlights: z.array(z.string()).optional(),
@@ -172,9 +172,9 @@ const richSkillsSchema = z.object({
 // =============================================================================
 const writingSchema = z.object({
     title: z.string().min(1, 'Article title is required'),
-    url: urlString,
-    date: dateFormat,
-    description: z.string().optional(), // Backwards compatible
+    url: urlString.optional(),
+    date: dateFormat.optional(),
+    description: z.string().optional(),
     excerpt: z.string().optional(),
     cover: urlOrPath.optional(),
     publication: z.string().optional(),
@@ -186,23 +186,23 @@ const writingSchema = z.object({
 // =============================================================================
 const experimentSchema = z.object({
     title: z.string().min(1, 'Experiment title is required'),
-    description: z.string().min(1, 'Experiment description is required'),
+    description: z.string().optional(),
     image: urlOrPath.optional(),
     github: urlString.optional(),
     demo: urlString.optional(),
-    tags: z.array(z.string()).min(1, 'At least one tag is required'),
+    tags: z.array(z.string()).optional(),
 });
 const testimonialSchema = z.object({
     quote: z.string().min(1, 'Quote is required'),
-    author: z.string().min(1, 'Author name is required'),
+    author: z.string().optional(),
     company: z.string().optional(),
     role: z.string().optional(),
     image: urlOrPath.optional(),
 });
 const timelineItemSchema = z.object({
-    year: z.union([z.string(), z.number()]),
+    year: z.union([z.string(), z.number()]).optional(),
     title: z.string().min(1, 'Timeline item title is required'),
-    description: z.string().min(1, 'Timeline item description is required'),
+    description: z.string().optional(),
     image: urlOrPath.optional(),
 });
 // =============================================================================
@@ -227,28 +227,28 @@ export const portfolioSchema = z.object({
     // Core metadata
     meta: z.object({
         name: z.string().min(1, 'Name is required'),
-        title: z.string().min(1, 'Professional title is required'),
+        title: z.string().optional(),
         tagline: z.string().optional(),
-        location: z.string().min(1, 'Location is required'),
+        location: z.string().optional(),
         timezone: z.string().optional(),
         avatar: urlOrPath.optional(),
         hero_image: urlOrPath.optional(),
     }),
     // Contact information
     contact: z.object({
-        email: z.string().email('Must be a valid email address'),
+        email: z.string().email('Must be a valid email address').optional(),
         website: urlString.optional(),
         github: z.string().optional(),
         linkedin: z.string().optional(),
         twitter: z.string().optional(),
-    }),
-    // Bio (required for backwards compatibility)
-    bio: z.string().min(10, 'Bio should be at least 10 characters'),
+    }).optional(),
+    // Bio
+    bio: z.string().optional(),
     // Extended about section (optional)
     about: z
         .object({
-        short: z.string().min(1, 'Short bio is required'),
-        long: z.string().min(1, 'Long bio is required'),
+        short: z.string().optional(),
+        long: z.string().optional(),
     })
         .optional(),
     // Sections (backwards compatible structure)
@@ -258,7 +258,7 @@ export const portfolioSchema = z.object({
         skills: simpleSkillsSchema.optional(),
         writing: z.array(writingSchema).optional(),
         education: z.array(educationSchema).optional(),
-    }),
+    }).optional(),
     // Rich projects (new structure for case studies)
     projects: z.array(richProjectSchema).optional(),
     // New content types

package/dist/generator/builder.js

@@ -645,7 +645,8 @@ async function generateSinglePageSiteInMemory(portfolio, themePath, theme, files
         enableHotkeys: settings.enable_hotkeys !== false,
         animate: settings.animate || 'subtle',
         hasExperience: (portfolio.sections.experience?.length ?? 0) > 0,
-        hasProjects: (portfolio.sections.projects?.length ?? 0) > 0,
+        hasProjects: ((portfolio.projects?.length ?? 0) > 0) || ((portfolio.sections.projects?.length ?? 0) > 0),
+        hasExperiments: (portfolio.experiments?.length ?? 0) > 0,
         hasSkills: portfolio.sections.skills && Object.keys(portfolio.sections.skills).length > 0,
         hasWriting: (portfolio.sections.writing?.length ?? 0) > 0,
         hasEducation: (portfolio.sections.education?.length ?? 0) > 0,

package/dist/generator/themes/dark-academia/styles.css

@@ -1,5 +1,5 @@
 /* ============================================
-   Dark Academia Theme for dev.page
+   Dark Academia Theme for devfolio.page
    Scholarly, vintage, warm aesthetic
    ============================================ */
 

package/dist/generator/themes/modern/styles.css

@@ -1,5 +1,5 @@
 /* ============================================
-   Modern Theme for dev.page
+   Modern Theme for devfolio.page
    Clean, contemporary, minimalist design
    ============================================ */
 

package/dist/generator/themes/srcl/styles.css

@@ -1,5 +1,5 @@
 /* ============================================
-   SRCL Theme for dev.page
+   SRCL Theme for devfolio.page
    Adapted from sacred.computer components
    ============================================ */
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "devfolio-page",
-  "version": "0.2.1",
+  "version": "0.2.3",
   "description": "Your portfolio as code. Version control it like software.",
   "type": "module",
   "bin": {

package/src/generator/themes/dark-academia/styles.css

@@ -1,5 +1,5 @@
 /* ============================================
-   Dark Academia Theme for dev.page
+   Dark Academia Theme for devfolio.page
    Scholarly, vintage, warm aesthetic
    ============================================ */
 

package/src/generator/themes/modern/styles.css

@@ -1,5 +1,5 @@
 /* ============================================
-   Modern Theme for dev.page
+   Modern Theme for devfolio.page
    Clean, contemporary, minimalist design
    ============================================ */
 

package/src/generator/themes/srcl/styles.css

@@ -1,5 +1,5 @@
 /* ============================================
-   SRCL Theme for dev.page
+   SRCL Theme for devfolio.page
    Adapted from sacred.computer components
    ============================================ */