The latest articles on DEV Community by Lidhish C (@lidhish_c). https://dev.to/lidhish_c https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3026728%2F5be14a62-e6a7-420e-a9b0-ffa0b516cca8.jpg https://dev.to/lidhish_c en Lidhish C Thu, 08 May 2025 13:27:52 +0000 https://dev.to/lidhish_c/introducing-lidhium-js-a-modern-cli-for-micro-frontend-development-2dac https://dev.to/lidhish_c/introducing-lidhium-js-a-modern-cli-for-micro-frontend-development-2dac <p>Micro-frontend architecture has revolutionised the way we build scalable and maintainable frontend applications. However, setting up and managing micro-frontends can be complex and time-consuming. Enter Lidhium JS—a powerful CLI tool designed to simplify and streamline micro-frontend development.</p> <p><strong>🔧 What is Lidhium JS?</strong></p> <p>Lidhium JS is a command-line interface tool that facilitates the creation and management of micro-frontend applications. Built with modern technologies like Vue 3, Webpack, and Tailwind CSS, it offers developers a seamless experience in setting up and orchestrating micro-frontends.</p> <p>Key features include:</p> <p><strong>Easy Setup:</strong> Quickly initialize projects with straightforward commands.</p> <p><strong>Type Safety</strong>: Leverages TypeScript for enhanced developer experience and autocomplete support.</p> <p><strong>Single Configuration:</strong> Manage multiple applications using a single configuration file, ensuring consistency across projects.</p> <p><strong>Monorepo Support:</strong> Efficiently handle multiple packages and applications within a single repository.</p> <p><strong>Performance Optimised:</strong> Designed with performance in mind, minimising overhead and ensuring efficient data handling.</p> <p><strong>Built-in Dev Tools:</strong> Monitor and debug applications seamlessly with integrated development tools.</p> <p><strong>🛠️ Getting Started</strong></p> <p>To install Lidhium JS globally:<br> </p> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code>npm install -g @lidhium/cli </code></pre> </div> <p>Initialize a new project:<br> </p> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code>lidhium init my-app </code></pre> </div> <p>Generate a new micro-frontend application:<br> </p> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code>lidhium generate app-name 3000 </code></pre> </div> <p>Start the development server:<br> </p> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code>yarn start app-name </code></pre> </div> <p>Build for production:<br> </p> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code>yarn build app-name </code></pre> </div> <p>Start the development tool:<br> </p> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code>yarn dev-tool </code></pre> </div> <blockquote> <p>Note: The first app you generate will always be of type host.</p> </blockquote> <p><strong>📦 Powered by Modern Technologies</strong></p> <p>Lidhium JS is built upon a robust tech stack:</p> <ul> <li><p>Vue 3: <em>A progressive JavaScript framework for building user interfaces.</em></p></li> <li><p>Webpack: <em>A module bundler for modern JavaScript applications.</em></p></li> <li><p>Tailwind CSS: <em>A utility-first CSS framework for rapid UI development.</em></p></li> </ul> <p><strong>🌐 Learn More</strong><br> For comprehensive documentation, examples, and community support, visit the official website: <a href="https://lidhiumjs.com" rel="noopener noreferrer">lidhiumjs.com</a></p> <p>Join the community and contribute to the evolution of micro-frontend development!</p> webdev vue webpack programming