create-foliokit 0.0.0-stage → 1.0.0

package/src/generator.js

@@ -0,0 +1,133 @@
+import { copyFile, lstat, mkdir, readFile, readdir, realpath, rm, writeFile } from 'node:fs/promises'
+import { extname, isAbsolute, join, relative, resolve, sep } from 'node:path'
+import { getDefaultTemplatePath } from './utils/paths.js'
+import { validateProjectName } from './utils/project-name.js'
+import { createProgress } from './utils/progress.js'
+
+const excludedDirectories = new Set([
+  '.angular', '.cache', '.git', '.netlify', '.next', '.parcel-cache', '.svelte-kit',
+  '.turbo', '.vercel', '.vite', 'build', 'coverage', 'dist', 'node_modules', 'tmp', 'temp',
+])
+const excludedExtensions = new Set([
+  '.bak', '.log', '.orig', '.pem', '.p12', '.pfx', '.key', '.secret', '.token',
+  '.swp', '.swo', '.tsbuildinfo',
+])
+const excludedFiles = new Set([
+  '.ds_store', '.envrc', '.npmignore', '.npmrc', '.netrc', '.pypirc', 'credentials', 'credentials.json',
+  'id_ed25519', 'id_rsa', 'secrets.json', 'thumbs.db',
+])
+
+function isWithin(parent, child) {
+  const path = relative(parent, child)
+  return path === '' || (!path.startsWith(`..${sep}`) && path !== '..' && !isAbsolute(path))
+}
+
+function shouldExclude(name, isDirectory) {
+  const lower = name.toLowerCase()
+  if (isDirectory && excludedDirectories.has(lower)) return true
+  if (excludedFiles.has(lower) || excludedExtensions.has(extname(lower))) return true
+  if (lower === '.env' || (lower.startsWith('.env.') && lower !== '.env.example')) return true
+  if (/\.(?:tmp|temp|swp|swo|orig|bak|log)$/.test(lower)) return true
+  return false
+}
+
+export function resolveProjectDestination(projectName, workingDirectory = process.cwd()) {
+  const validation = validateProjectName(projectName)
+  if (validation !== true) throw new Error(`Invalid project name: ${validation}`)
+  const base = resolve(workingDirectory)
+  const destination = resolve(base, projectName)
+  if (!isWithin(base, destination) || destination === base) {
+    throw new Error('The project destination must be a new child of the working directory.')
+  }
+  return destination
+}
+
+async function copyTree(source, destination) {
+  await mkdir(destination, { recursive: true })
+  for (const entry of await readdir(source, { withFileTypes: true })) {
+    if (shouldExclude(entry.name, entry.isDirectory())) continue
+    const from = join(source, entry.name)
+    const to = join(destination, entry.name)
+    if (entry.isSymbolicLink()) throw new Error(`Template contains an unsupported symbolic link: ${from}`)
+    if (entry.isDirectory()) {
+      await copyTree(from, to)
+    } else if (entry.isFile()) {
+      await copyFile(from, to)
+    }
+  }
+}
+
+async function updatePackageNames(destination, projectName) {
+  const packagePath = join(destination, 'package.json')
+  const packageData = JSON.parse(await readFile(packagePath, 'utf8'))
+  packageData.name = projectName
+  await writeFile(packagePath, `${JSON.stringify(packageData, null, 2)}\n`)
+
+  const lockPath = join(destination, 'package-lock.json')
+  try {
+    const lock = JSON.parse(await readFile(lockPath, 'utf8'))
+    lock.name = projectName
+    if (lock.packages?.['']) lock.packages[''].name = projectName
+    await writeFile(lockPath, `${JSON.stringify(lock, null, 2)}\n`)
+  } catch (error) {
+    if (error.code !== 'ENOENT') throw error
+  }
+}
+
+export function getDefaultTemplateDirectory() {
+  return getDefaultTemplatePath()
+}
+
+export async function generatePortfolio(options, context = {}) {
+  const projectName = options?.projectName
+  const workingDirectory = resolve(context.workingDirectory ?? process.cwd())
+  const templatePath = resolve(context.templateDirectory ?? getDefaultTemplateDirectory())
+
+  const [workingStats, templateStats] = await Promise.all([lstat(workingDirectory), lstat(templatePath)])
+  if (!workingStats.isDirectory()) throw new Error(`Working directory is not a directory: ${workingDirectory}`)
+  if (!templateStats.isDirectory()) throw new Error(`Portfolio template directory was not found: ${templatePath}`)
+  const [realDestinationParent, realTemplate] = await Promise.all([realpath(workingDirectory), realpath(templatePath)])
+  const destination = resolveProjectDestination(projectName, realDestinationParent)
+  if (isWithin(realTemplate, destination) || isWithin(destination, realTemplate)) {
+    throw new Error('The project destination cannot overlap the bundled template directory.')
+  }
+
+  const creating = createProgress('Creating project...').start()
+  try {
+    await mkdir(destination)
+  } catch (error) {
+    creating.fail('Could not create project directory')
+    if (error.code === 'EEXIST' && options.overwrite === true) {
+      const existing = await lstat(destination)
+      if (!existing.isDirectory() || existing.isSymbolicLink()) {
+        throw new Error(`The destination exists and is not a regular directory: ${destination}`)
+      }
+      await rm(destination, { recursive: true })
+      await mkdir(destination)
+    } else if (error.code === 'EEXIST') {
+      const conflict = new Error(`The destination already exists: ${destination}`)
+      conflict.code = 'EEXIST'
+      conflict.projectPath = destination
+      throw conflict
+    } else {
+      throw error
+    }
+  }
+  creating.succeed('Project directory created')
+
+  const progress = createProgress('Copying portfolio template...').start()
+  let configuring
+  try {
+    await copyTree(templatePath, destination)
+    progress.succeed('Copying portfolio template')
+    configuring = createProgress('Configuring package.json...').start()
+    await updatePackageNames(destination, projectName)
+    configuring.succeed('Configuring package.json')
+    return destination
+  } catch (error) {
+    progress.fail('Could not create portfolio')
+    configuring?.fail('Could not configure project')
+    await rm(destination, { recursive: true, force: true })
+    throw error
+  }
+}

package/src/prompts.js

@@ -0,0 +1,44 @@
+import inquirer from 'inquirer'
+import {
+  DEFAULT_PROJECT_NAME,
+  normalizeProjectName,
+  validateProjectName,
+} from './utils/project-name.js'
+
+export function createProjectQuestions() {
+  return [
+    {
+      type: 'input',
+      name: 'projectName',
+      message: 'What should your project be called?',
+      default: DEFAULT_PROJECT_NAME,
+      filter: normalizeProjectName,
+      validate: validateProjectName,
+    },
+    {
+      type: 'confirm',
+      name: 'installDependencies',
+      message: 'Install dependencies?',
+      default: true,
+    },
+  ]
+}
+
+export async function promptForProjectOptions(prompt = (questions) => inquirer.prompt(questions)) {
+  try {
+    const answers = await prompt(createProjectQuestions())
+    if (!answers) return null
+
+    const projectName = normalizeProjectName(answers.projectName)
+    const validation = validateProjectName(projectName)
+    if (validation !== true) throw new Error(validation)
+
+    return {
+      projectName,
+      installDependencies: Boolean(answers.installDependencies),
+    }
+  } catch (error) {
+    if (error instanceof Error && error.name === 'ExitPromptError') return null
+    throw error
+  }
+}

package/src/utils/errors.js

@@ -0,0 +1,7 @@
+import chalk from 'chalk'
+
+export function reportCliError(error) {
+  const message = error instanceof Error ? error.message : String(error)
+  process.stderr.write(`${chalk.red('FolioKit error:')} ${message}\n`)
+  process.exitCode = 1
+}

package/src/utils/paths.js

@@ -0,0 +1,12 @@
+import { dirname, resolve } from 'node:path'
+import { fileURLToPath } from 'node:url'
+
+const packageRoot = resolve(dirname(fileURLToPath(import.meta.url)), '../..')
+
+export function getPackagePath(...segments) {
+  return resolve(packageRoot, ...segments)
+}
+
+export function getDefaultTemplatePath() {
+  return getPackagePath('templates', 'default')
+}

package/src/utils/progress.js

@@ -0,0 +1,5 @@
+import ora from 'ora'
+
+export function createProgress(message) {
+  return ora(message)
+}

package/src/utils/project-name.js

@@ -0,0 +1,30 @@
+export const DEFAULT_PROJECT_NAME = 'my-portfolio'
+
+const projectNamePattern = /^[a-z0-9]+(?:-[a-z0-9]+)*$/
+const reservedNames = new Set([
+  'node_modules',
+  'con',
+  'prn',
+  'aux',
+  'nul',
+  ...Array.from({ length: 9 }, (_, index) => `com${index + 1}`),
+  ...Array.from({ length: 9 }, (_, index) => `lpt${index + 1}`),
+])
+
+export function normalizeProjectName(value) {
+  if (typeof value !== 'string') return DEFAULT_PROJECT_NAME
+  return value.trim() || DEFAULT_PROJECT_NAME
+}
+
+export function validateProjectName(value) {
+  const name = typeof value === 'string' ? value.trim() : ''
+
+  if (!name) return 'Enter a project name.'
+  if (name.length > 214) return 'Project names must be 214 characters or fewer.'
+  if (!projectNamePattern.test(name)) {
+    return 'Use lowercase letters and numbers separated by single hyphens.'
+  }
+  if (reservedNames.has(name)) return 'That name is reserved by the operating system or npm.'
+
+  return true
+}

package/templates/default/.gitignore

@@ -0,0 +1,20 @@
+node_modules/
+dist/
+.vite/
+.netlify/
+.vercel/
+coverage/
+*.tsbuildinfo
+*.log
+npm-debug.log*
+.DS_Store
+Thumbs.db
+.env
+.env.*
+secrets/
+*.pem
+*.key
+*.p12
+*.pfx
+*.credentials
+*.secret

package/templates/default/data.ts

@@ -0,0 +1,227 @@
+/*
+ * FolioKit Portfolio Configuration
+ *
+ * Customize your portfolio by editing the information in this file.
+ * Replace the sample content with your own details.
+ *
+ * You generally do not need to edit the React components or other source
+ * files to update your personal information, projects, skills, or links.
+ *
+ * Icon Reference Links:
+ * - Technical Skills: https://skillicons.dev
+ * - Social & Brand Icons: https://simpleicons.org
+ */
+
+export interface Skill {
+  name: string
+  icon: string
+  category?: string
+}
+
+export interface Project {
+  name: string
+  category?: string
+  description: string
+  image?: string
+  imageAlt?: string
+  technologies: Skill[]
+  liveUrl?: string
+  githubUrl?: string
+  featured?: boolean
+}
+
+export interface ContentItem {
+  title: string
+  organization?: string
+  date?: string
+  description?: string
+  image?: string
+  links?: { label: string; url: string }[]
+}
+
+export interface Testimonial {
+  name: string
+  role: string
+  company?: string
+  message: string
+  image?: string
+}
+
+export interface SocialIcon {
+  label: string
+  icon: string
+  url?: string
+  color?: string
+}
+
+export interface PortfolioConfig {
+  profile: {
+    name: string
+    headline: string
+    introduction: string
+    about: string
+    location?: string
+    timeZone?: string
+    timeZoneLabel?: string
+    profileImage?: string
+    resumeUrl?: string
+    quote?: string
+  }
+  seo: {
+    title: string
+    description: string
+    siteUrl?: string
+    image?: string
+  }
+  socialIcons: SocialIcon[]
+  skills: Skill[]
+  projects: Project[]
+  experience: ContentItem[]
+  education: ContentItem[]
+  testimonials: Testimonial[]
+  contact: {
+    email?: string
+  }
+}
+
+export const portfolioConfig: PortfolioConfig = {
+  // Personal Information
+  profile: {
+    name: 'Your Name',
+    headline: 'Full Stack Developer',
+    introduction: "Hey, there! I'm a",
+    about: `Hey, there! I'm a developer who loves building products that people actually use. Write a couple of sentences here about who you are, what you do, and what you're currently working on.
+
+Use this space to talk about your experience, the kinds of problems you enjoy solving, and the technologies you reach for most often.
+
+Wrap up with what you're excited about right now — side projects, open source, or whatever you're learning next`,
+    location: 'Delhi, India',
+    timeZone: 'Asia/Kolkata', // IANA time zone for the live clock
+    timeZoneLabel: 'IST',
+    profileImage: '/avatar-placeholder.svg', // Path relative to public/ directory
+    quote: 'Build with curiosity. Share what you learn.',
+  },
+
+  // SEO & Metadata
+  seo: {
+    title: '{{name}} — {{headline}}',
+    description: '{{name}} is a {{headline}} building useful, thoughtful web experiences.',
+  },
+
+  // Social Links
+  // Add, edit, remove, or reorder your social media profiles.
+  // Find brand icons at: https://simpleicons.org (built-in icons: 'mail', 'file-text')
+  socialIcons: [
+    { label: 'GitHub', icon: 'github', url: 'https://github.com/your-username', color: '#f2f0e9' },
+    { label: 'LinkedIn', icon: 'linkedin', url: 'https://linkedin.com/in/your-username', color: '#0a66c2' },
+    { label: 'Instagram', icon: 'instagram', url: 'https://instagram.com/your-username', color: '#e4405f' },
+    { label: 'X', icon: 'x', url: 'https://x.com/your-username', color: '#f2f0e9' },
+  ],
+
+  // Skills
+  // Add, edit, remove, or reorder skills.
+  // Find skill icon identifiers at: https://skillicons.dev
+  skills: [
+    { name: 'HTML', icon: 'html', category: 'Frontend' },
+    { name: 'CSS', icon: 'css', category: 'Frontend' },
+    { name: 'JavaScript', icon: 'js', category: 'Frontend' },
+    { name: 'React', icon: 'react', category: 'Frontend' },
+    { name: 'TypeScript', icon: 'ts', category: 'Frontend' },
+    { name: 'Tailwind CSS', icon: 'tailwind', category: 'Frontend' },
+    { name: 'Vite', icon: 'vite', category: 'Tools' },
+    { name: 'Redux', icon: 'redux', category: 'Frontend' },
+    { name: 'Markdown', icon: 'md', category: 'Tools' },
+    { name: 'Node.js', icon: 'nodejs', category: 'Backend' },
+    { name: 'Express.js', icon: 'express', category: 'Backend' },
+    { name: 'MongoDB', icon: 'mongodb', category: 'Backend' },
+    { name: 'MySQL', icon: 'mysql', category: 'Backend' },
+    { name: 'PostgreSQL', icon: 'postgres', category: 'Backend' },
+    { name: 'C', icon: 'c', category: 'Languages' },
+    { name: 'Python', icon: 'python', category: 'Languages' },
+    { name: 'Java', icon: 'java', category: 'Languages' },
+    { name: 'Postman', icon: 'postman', category: 'Tools' },
+    { name: 'VS Code', icon: 'vscode', category: 'Tools' },
+    { name: 'Git', icon: 'git', category: 'Tools' },
+    { name: 'GitHub', icon: 'github', category: 'Tools' },
+    { name: 'npm', icon: 'npm', category: 'Tools' },
+    { name: 'GitHub Actions', icon: 'githubactions', category: 'Tools' },
+  ],
+
+  // Projects
+  // Add, edit, remove, or reorder projects. Set featured: true to highlight in the 3D gallery.
+  // Technology icon identifiers also come from: https://skillicons.dev
+  projects: [
+    {
+      name: 'Project One',
+      category: 'PROJECT CATEGORY',
+      description: 'Add a short description of this project, the problem it solves, and what you built.',
+      image: '/project-placeholder.svg',
+      imageAlt: 'Project image placeholder, 1200 by 675 pixels',
+      technologies: [{ name: 'React', icon: 'react' }, { name: 'TypeScript', icon: 'ts' }],
+      featured: true, // Highlights project in the 3D magazine gallery
+    },
+    {
+      name: 'Project Two',
+      category: 'PROJECT CATEGORY',
+      description: 'Describe another project here. Replace the title, image, and technology stack in data.ts.',
+      image: '/project-placeholder.svg',
+      imageAlt: 'Project image placeholder, 1200 by 675 pixels',
+      technologies: [{ name: 'Node.js', icon: 'nodejs' }, { name: 'Express.js', icon: 'express' }, { name: 'MongoDB', icon: 'mongodb' }],
+    },
+    {
+      name: 'Project Three',
+      category: 'PROJECT CATEGORY',
+      description: 'Use this space to explain what you made and the tools or technologies you used.',
+      image: '/project-placeholder.svg',
+      imageAlt: 'Project image placeholder, 1200 by 675 pixels',
+      technologies: [{ name: 'Python', icon: 'python' }, { name: 'C', icon: 'c' }, { name: 'Java', icon: 'java' }],
+    },
+  ],
+
+  // Work Experience
+  // Add, edit, remove, or reorder work history. Leave empty ([]) to hide this section.
+  experience: [
+    {
+      title: 'Your Role',
+      organization: 'Company Name',
+      date: 'Month YYYY – Present',
+      description: 'Replace this sample with your role, company, and dates.',
+    },
+  ],
+
+  // Education
+  // Add, edit, remove, or reorder education. Leave empty ([]) to hide this section.
+  education: [
+    {
+      title: 'Degree or Program',
+      organization: 'Your University',
+      date: 'YYYY – YYYY',
+      description: 'Add your major, score, or another education detail here.',
+    },
+  ],
+
+  // Testimonials
+  // Add, edit, remove, or reorder testimonials. Leave empty ([]) to hide this section.
+  testimonials: [
+    {
+      name: 'Person One',
+      role: 'Role or designation',
+      message: 'Replace this placeholder with a genuine testimonial before publishing.',
+    },
+    {
+      name: 'Person Two',
+      role: 'Role or designation',
+      message: 'Replace this placeholder with a genuine testimonial before publishing.',
+    },
+    {
+      name: 'Person Three',
+      role: 'Role or designation',
+      message: 'Replace this placeholder with a genuine testimonial before publishing.',
+    },
+  ],
+
+  // Contact
+  contact: {
+    email: 'hello@example.com',
+  },
+}

package/templates/default/index.html

@@ -0,0 +1,23 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta name="theme-color" content="#000000" />
+    <meta name="description" content="A developer portfolio." />
+    <meta property="og:type" content="website" />
+    <meta property="og:title" content="Developer Portfolio" />
+    <meta property="og:description" content="A developer portfolio." />
+    <meta name="twitter:card" content="summary_large_image" />
+    <meta name="twitter:title" content="Developer Portfolio" />
+    <meta name="twitter:description" content="A developer portfolio." />
+    <title>Developer Portfolio</title>
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&family=Space+Grotesk:wght@400;500;600;700&display=swap" rel="stylesheet" />
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>