New Echoes

New Echoes is an Astro personal website template designed for building an integrated homepage that combines articles, projects, books, movies, photos, and travel footprints. It outputs a static site with a 3D animated opening scene, article browsing and filtering, project showcases, media records, and deployment configurations for three platforms.

What is New Echoes?

New Echoes is a personal website template built on Astro that takes Markdown and MDX content as input and generates a static, multi-page personal homepage as output. The template includes default pages for articles, projects, a timeline, movies, books, a photo gallery, an about page, and a global knowledge graph. It is developed by GitHub user lsy2246 and the repository includes live previews on Cloudflare Pages, Vercel, and EdgeOne Pages.

What makes New Echoes stand out?

• 3D animated first screen — The homepage opens with a scrolling narrative animation, then transitions into a 3D scene with a desktop, keyboard, and character model.
• Article directory and filtering — Articles can be organized by category and filtered by keyword, tag, and time range; the timeline view shows both creation and update dates.
• Rich article rendering — Article pages support code highlighting, copy buttons, tables, task lists, Mermaid diagrams, and revision history.
• Project showcase — A dedicated projects page displays repositories from GitHub, Gitee, or Gitea, including description, language, and star counts.
• Media tracking pages — The template includes a Douban movie page, a WeChat Reading book list page, and a photo wall built from Google Photos shared albums.
• Interactive about page — The about section features a countdown timer and a 3D world map showing travel footprints.
• Global knowledge graph — A graph view visualizes relationships between articles on the site.
• Built-in SEO and subscription outputs — Static assets include RSS, sitemap, robots.txt, and llms.txt generation.

Who is New Echoes for?

New Echoes suits individuals who want a personal homepage with multiple content sections beyond a simple blog. Developers who want to display both writing and coding projects can use the integrated project pages. Readers and movie watchers who keep records on Douban and WeChat Reading can reuse those data sources in the film and book pages. Photographers can build a photo gallery from Google Photos shared albums. Users who want a long-term updatable public template repository can follow the built-in update workflow.

What can you do with New Echoes?

• Bloggers: Publish Markdown or MDX articles with code highlighting and Mermaid diagrams, and let readers discover related posts through the knowledge graph.
• Developers: Connect GitHub, Gitee, or Gitea repositories and show language, stars, and descriptions on a projects page.
• Photographers: Generate a masonry photo wall from Google Photos shared albums without manual image hosting.
• Travelers: Use the about page's 3D world map to display visited countries and add a countdown timer for future trips.

How does New Echoes work?

The workflow begins by cloning the repository and installing dependencies with Bun, which requires Node.js 22 or newer. Site-wide metadata is edited in src/consts.ts, and new articles are created with the bun run newpost command, with optional directory names. Deployment is platform-specific: run bun run build:vercel, bun run build:cloudflare, or bun run build:edgeone, and each build outputs to dist with separate API function entries under api/, functions/api/, or cloud-functions/api/. The template also provides a bun run update command that syncs upstream template changes while protecting user files defined in update.json.

FAQ

How do I create a new article?

Run bun run newpost from the project root. You can also pass a directory and title, for example bun run newpost "dev/My Title". Articles are frontmatter files with title, date, tags, and optional summary; the title is used to generate the article URL and must be unique within a folder.

Which platforms does New Echoes deploy to?

The template supports Vercel, Cloudflare Pages, and EdgeOne Pages. Each platform uses its own build command (build:vercel, build:cloudflare, build:edgeone) and has a corresponding configuration file (vercel.json, edgeone.json, or the Cloudflare console). Live previews are available on all three platforms.

How does the template update without overwriting my content?

The update.json file defines protect and update patterns. Files under src/content, public/images, favicon.svg, src/consts.ts, README.md, and src/pages are protected by default and keep local versions. Articles under src/pages/articles remain updatable even though the folder is protected. Running bun run update previews the file list first; bun run update -- --apply applies changes directly.

What are the Node.js and package manager requirements?

Node.js 22 or newer is recommended, and the setup uses Bun as the package manager and script runner. The quick start commands are bun install and bun run dev, with the development server defaulting to http://localhost:4321.