Codeimage

screenshot of Codeimage
solid
vite

A tool to beautify your code screenshots. Built with SolidJS and Fastify.

Overview:

CodeImage is a tool designed to help developers create visually appealing screenshots of their source code. It offers a range of features to streamline the process of sharing code snippets on social media platforms. The tool is built on a PNPM monorepo architecture and includes front-end applications, a REST API layer, and various packages for UI, configurations, highlighting, and more.

Features:

  • Create elegant code screenshots: Showcase source code in an aesthetically pleasing manner.
  • Built with SolidJS: Utilizes the SolidJS framework for the front-end application.
  • Zero-runtime Stylesheets with vanilla-extract: Employs vanilla-extract for stylesheets in TypeScript.
  • Composable state management: Uses StateBuilder for managing state in a modular way.
  • Accessible UI Kit: Offers an accessible UI Kit based on Kobaltesolid-primitives.
  • Custom editor and highlighting themes: Includes custom editor themes and code highlighting for CodeMirror.
  • Internationalization support: Provides a wrapper for i18n with strict typing for internationalization.
  • Small state manager: Contains a state manager with utilities for RxJS and solid-js/store.
solid
Solid

SolidJS is a declarative JavaScript library for building user interfaces, offering a reactive programming model for efficient updates. It stands out for its reactivity system that minimizes unnecessary re-renders and its small bundle size, making it a performant choice for developing lightweight and reactive web applications.

vite
Vite

Vite is a build tool that aims to provide a faster and leaner development experience for modern web projects

eslint
Eslint

ESLint is a linter for JavaScript that analyzes code to detect and report on potential problems and errors, as well as enforce consistent code style and best practices, helping developers to write cleaner, more maintainable code.

typescript
Typescript

TypeScript is a superset of JavaScript, providing optional static typing, classes, interfaces, and other features that help developers write more maintainable and scalable code. TypeScript's static typing system can catch errors at compile-time, making it easier to build and maintain large applications.