Delivering an excellent user experience and a seamless developer experience is essential for creating high-quality modern applications. Leveraging a modern, flexible tech stack that minimizes friction for developers while maximizing performance and user satisfaction is key. The vision presented here focuses on practicality, simplicity, cohesion, and efficiency across various platforms, using technologies tailored to specific platforms and use cases across for the web, Apple platforms, Android, Windows, and games.
Astro’s framework allows static websites to be developed quickly and efficiently, leveraging modern JavaScript tooling. Astro's focus on island architecture means no unnecessary JavaScript is shipped to the client, keeping performance high. Preact Signals introduces a reactivity system for updating the UI, enabling real-time interactivity while keeping the app responsive. Drizzle, a lightweight database ORM, is integrated for simple and effective data management. Tailwind offers utility-first CSS to rapidly style applications, maintaining both flexibility and performance.
- Simplify static site creation by using Astro’s optimized static rendering and Preact’s fine-grained reactivity.
- Reduce bundle sizes by leveraging Astro’s islands architecture, which minimizes JavaScript on the client side.
- Maximize developer productivity with TypeScript, Preact Signals, and Drizzle’s ORM for a unified DX.
- TypeScript
- Remix (React Router/Reverb)
- Drizzle
- Tailwind CSS
- Tailwind UI
- Catalyst
- shadcn/ui
Remix offers seamless dynamic page loading, enabling developers to create fast, reactive web applications that enhance UX. Drizzle integrates with the database, providing developers with a lightweight, type-safe ORM to manage data. Tailwind CSS ensures that the UI can be designed quickly and efficiently with minimal CSS bloat. TypeScript provides the type safety and scalability needed to maintain complex applications with ease.
- Enable fast, interactive web apps with Remix’s modern approach to routing and data loading.
- Empower developers with Drizzle’s easy-to-use ORM for data interactions and Tailwind for efficient UI creation.
- Ensure type safety and maintainability with TypeScript to support scaling apps smoothly.
For API servers, Deno provides a modern and secure runtime environment with native TypeScript support. Hono, a lightweight web framework, enables rapid API development with minimal overhead. Drizzle ORM manages database operations, while Open API ensures that APIs are well-documented and easily consumed. REST serves as the default architectural style, ensuring interoperability and simplicity in communication between services.
- Build fast, secure, and scalable APIs using Deno and Hono.
- Simplify database interactions with Drizzle while ensuring APIs are self-documenting through Open API standards.
- Enable interoperability via REST, ensuring services can easily integrate with others.
Shared business logic written in Rust can be compiled into WebAssembly, making it usable across different platforms, from web apps to Deno servers, Rust servers, Apple platform apps, Android apps, Windows apps, and beyond. This approach maximizes code reuse and ensures that business logic is consistent across the entire application ecosystem.
- Maximize code reuse by writing shared business logic in Rust and deploying it through WebAssembly.
- Maintain consistency across web, mobile, and server environments by sharing core logic across all platforms.
- Enhance performance with WebAssembly’s near-native execution speed.
Rust's performance and safety make it an ideal language for high-performance servers, particularly those requiring concurrency and parallel processing. Hyper, a fast, low-level HTTP library for Rust, serves as the foundation for building these servers. Open API integration ensures the services are well-documented and easily consumable. REST continues to provide the foundation for communication, ensuring scalability and maintainability.
The use case for this kind of server should be exceedingly rare and the exception, rather than the rule. Always start with a Deno-based server, first opting to bridge performance sensitive code with Rust in WebAssembly first, then with Rust via Deno's FFI, and finally switch to a Hyper-based Rust-native server only as a last resort.
- Maximize server performance using Rust and Hyper for concurrency and speed.
- Ensure reliability with Rust’s strong type system and memory safety guarantees.
- Maintain service interoperability through Open API and REST.
Deploying apps and servers at the edge, combined with a CDN-first approach, ensures that users receive content as quickly as possible, no matter where they are located. This minimizes latency and ensures that apps load fast, providing a seamless experience for users.
I don't want to be perscriptive about which service we deploy to or which database provider we use. Those things will change over time based on changing companies and the unique need of the app or service.
- Minimize latency by deploying apps on edge servers, bringing them closer to the user.
- Ensure fast load times with a CDN-first strategy, reducing the time to first byte (TTFB) and improving the overall user experience.
Swift and SwiftUI provide a modern approach to app development on Apple platforms. SwiftUI’s declarative syntax allows developers to create rich, interactive UIs with minimal code, while UIKit remains available for the application lifecycle and more granular control over specific controls or entire views when necessary. SwiftData ensures efficient data management across apps, with the ability to create custom stores as of 2024.
- Maximize app performance on Apple platforms using Swift and its modern toolset.
- Enable rapid UI development with SwiftUI’s declarative approach while keeping UIKit for specific use cases.
- Ensure efficient data management with SwiftData for seamless interactions.
- Kotlin
- Jetpack Compose
- Room
- Or Door with a custom libSQL adapter
Kotlin and Jetpack Compose form the backbone of Android app development, with Compose’s modern declarative UI system enabling developers to quickly build responsive and engaging interfaces. Room provides a type-safe database layer, ensuring that data is efficiently managed across the app.
- Streamline Android development using Kotlin and Jetpack Compose for rapid UI creation.
- Ensure data reliability with Room’s type-safe ORM, simplifying database interactions.
- Enhance developer productivity through Kotlin’s modern syntax and Compose’s declarative approach.
- C# & .NET
- XAML
- WinUI 3
- EF Core
- Custom Database Provider for libSQL
C# and XAML are key to building modern Windows applications, with WinUI 3 offering powerful UI capabilities. EF Core serves as the data layer, providing robust database access while maintaining type safety and performance.
- Create rich Windows applications using C# and XAML for a modern UI experience.
- Leverage WinUI 3 for a performant and responsive interface.
- Ensure efficient data management with EF Core, simplifying database interactions.
A powerful, lightweight, and extensible code editor offering advanced debugging, IntelliSense, and integrated version control. It’s well-suited for the entire tech stack, from frontend to backend development.
Extensions:
- Astro
- Deno
- Dev Containers
- ESLint
- File Nesting Updater
- GitHub Actions
- GitHub PRs
- GitHub Theme
- Live Share
- MDX
- npm
- QuickType
- Prettier
- RapidAPI
- Remote Explorer
- Remote SSH
- Tailwind CSS
- TODO Highlight
- Vitest
GitHub provides project code hosting and issue tracking to manage bugs, tasks, and feature requests. Integrated with GitHub Actions for CI/CD automation directly within the repository.
Tower is a powerful Git client that provides an intuitive, visual interface for managing repositories. It is available for both macOS and Windows, offering a smooth experience for Git operations like commits, branching, merging, and conflict resolution. Tower integrates seamlessly with popular Git hosting services like GitHub, GitLab, and Bitbucket, making it easier for developers to collaborate and manage version control.
Linear offers project management that integrates seamlessly with GitHub Issues and PRs, providing a fast, streamlined way to manage tasks, sprints, and roadmaps.
A collaborative design tool where designers and developers can collaborate on UI/UX elements. Version control and design token syncing ensure design consistency and seamless handoff to developers.
A CI/CD tool that allows for build, test, and deployment automation within GitHub repositories, making it easy to deploy to platforms such as Vercel, Netlify, and AWS.
Google’s suite of productivity tools (Docs, Sheets, Slides, Drive) allows for real-time collaboration on project documents, planning, and data management.
A messaging platform designed for real-time communication and collaboration across teams. Integrates well with GitHub and project management tools for status updates and notifications.
Video conferencing software used for virtual meetings, stand-ups, and collaboration sessions, featuring screen sharing and live collaboration.
A knowledge management tool that serves as a project wiki or documentation hub, centralizing notes, planning, and ongoing discussions.
A video messaging tool for asynchronous communication, perfect for sharing demos, explanations, or feedback without scheduling a meeting.
A hosting platform optimized for modern JavaScript web frameworks offering a fast global CDN and serverless functions for dynamic applications.
An alternative to Vercel, providing continuous deployment and serverless functions for both static and dynamic web apps, with intuitive setup and management.
A global content delivery network (CDN) enhancing security and performance, providing DDoS protection, load balancing, and Edge serverless functions.
A customer support platform to manage user feedback, bug reports, and inquiries through an integrated ticketing system.
Description: A VS Code extension allowing developers to visually create and configure new projects without leaving the IDE.
Features:
- Visual project picker with templates for frameworks like SvelteKit, Remix, and Deno.
- Pre-configured linter, testing, and build tool setups.
- Automatic dependency installation based on project needs.
Description: Manage design tokens within VS Code, generating platform-specific assets for Tailwind, Swift, and Android.
Features:
- Import design tokens from Figma.
- Generate Tailwind config and platform assets.
- Visual design system editor with real-time codebase updates.
Description: A search tool within VS Code for finding and adding NPM packages to your project.
Features:
- Google-like NPM search interface.
- One-click installation with automatic
package.jsonupdates. - Package info preview with advanced search filters.
Description: An organizational tool for VS Code that categorizes files and offers customizable templates for fast development workflows.
Features:
- Customizable file sections (components, API routes, tests).
- Quick file creation with predefined templates.
- Drag-and-drop sorting for better project organization.
Description: A visual deployment manager integrated within VS Code, supporting multiple platforms like GitHub Actions, Vercel, Netlify, and Cloudflare Pages.
Features:
- Visual deployment configuration for various platforms.
- CI/CD integration with drag-and-drop pipelines.
- Real-time deployment status updates within the IDE.
Description: A live database management tool for VS Code, enabling schema management, content editing, and migration previews.
Features:
- Real-time database content viewer and editor.
- Schema management with migration support.
- Migration previewing before applying changes.
- Multi-database support for PostgreSQL, MySQL, SQLite, etc.
Description: A live preview and WYSIWYG editor integrated into VS Code for building and testing web apps in real-time.
Features:
- Live preview with real-time updates.
- Visual WYSIWYG editing for layouts.
- Cross-browser testing without leaving the IDE.
- Remix support with dynamic reloads.
Description: An advanced Git management tool within VS Code, providing an intuitive visual interface for managing branches, commits, and merges. Drag and drop git history rewriting.
Features:
- Visual Git interface with drag-and-drop conflict resolution and history rewriting.
- Commit history explorer with file change previews.
- Branch management with easy switching and merging.
Description: A theme editor for VS Code, allowing developers to customize and preview their editor’s theme visually.
Features:
- Real-time theme customization and preview.
- Syntax highlighting customization.
- Theme export for personal or community sharing.
Description: Comprehensive development support across Apple (Swift), Android (Kotlin), and Windows (C#/XAML) platforms in VS Code, offering a unified experience for building, debugging, and deploying applications. This approach covers all key aspects of cross-platform development, ensuring streamlined workflows regardless of the target operating system.
Features:
- Build and Run Apps Across Platforms: Build and run apps for Apple platforms, Android, and Windows directly from VS Code, with keyboard shortcuts to launch simulators and emulators.
- Debugging Support: Full-featured debugging for Apple platforms (iOS, macOS, iPadOS, tvOS, watchOS, and visionOS), Android, and Windows apps, with support for breakpoints, real-time logging, and step-through debugging.
- Format on Save: Automatic code formatting on save, respecting platform-specific and project-specific formatting settings for Swift, Kotlin, and C# codebases.
- Project File Integration: Open and edit project files seamlessly across Xcode projects (Apple platforms), Android project files, and Visual Studio project files (Windows). Includes IntelliSense and syntax highlighting for all platforms.
- Package Management: Visual interface for managing dependencies across Swift Package Manager (Apple), Gradle (Android), and NuGet (Windows), allowing easy addition, removal, and version control of packages.
- Hot Reloading: Simple hot reloading setup and usage for Apple platforms (SwiftUI/UIKit), Android (Jetpack Compose), and Windows (WinUI), enabling developers to see live UI changes without restarting the app.
- Refactoring Tools: Built-in commands for refactoring across all supported languages (Swift, Kotlin, C#), including renaming symbols, extracting methods, and optimizing project structure.
- Semantic Syntax Highlighting: Advanced semantic syntax highlighting from the language server, ensuring rich and consistent code visualization for Swift, Kotlin, C#, and their respective frameworks and languages across platforms.
Description: Embedding Deno into a Rust + Hyper server allows us to leverage the best of both worlds: using Rust for high-performance and resource-intensive routes while maintaining ease of development for less critical endpoints with Deno and TypeScript. Since Deno is predominantly written in Rust, this integration can be achieved using the deno_runtime crate, allowing developers to embed Deno’s JavaScript/TypeScript engine directly into a Hyper-based server. This would provide an efficient pathway to use Rust for critical operations and Deno for faster prototyping or less performance-sensitive features.
Features:
- Hybrid Rust + TypeScript Routing: Design your Hyper server so that performance-critical routes are handled natively by Rust, while less intensive endpoints can be written in TypeScript and handled via Deno.
- Easy Deno Embedding: Leverage Deno’s embedding capabilities using
deno_runtimeto execute TypeScript within your Rust-based server. - Flexible Development: Maintain the convenience of TypeScript for rapid development while ensuring high performance where needed, reducing the barrier for developers to switch between Rust and TypeScript.
- Seamless Integration: Use Deno’s FFI to communicate between Rust and TypeScript, passing data efficiently and ensuring smooth integration between high-performance Rust logic and TypeScript code.
- Performance Optimization Path: Begin with a Deno server for simplicity, migrate performance-sensitive logic to Rust WebAssembly or Deno’s FFI when needed, and finally embed Deno within a Rust + Hyper server for a fully optimized stack.