Example Gallery

Discover hands-on examples demonstrating how to build real-world applications features with ebosma.

View Examples

Featured Examples

Custom Button Component

Learn to create reusable buttons with custom styling and interactive states.

View Example

Form Validation

Build a form with validation for fields and display user feedback.

View Example

Dynamic Routing

Implement user profiles with generated routes and data fetching.

View Example

Live Code Example

example-button.js


import { state, Component } from '@ebosma/core'

export default function Button ({ label, onClick }) {
  const hovered = state(false)
  const baseStyle = 'px-4 py-2 rounded transition-all text-white'
  const hoverStyle = 'scale-105' 

  return (
    <button 
      class={`${baseStyle} 
             bg-indigo-600 
             ${hovered.value ? hoverStyle : ''}`}
      onClick={onClick}
      onMouseEnter={() => hovered.value = true}
      onMouseLeave={() => { hovered.value = false }}
    >
      {label}
    </button>
  )
}


// Usage
<Button onClick={() => console.log('Clicked!')} label="Click Me" />

Want to Create Your Own?

Start building your next project with our ready-made examples templates and starter kits.

View Starter Templates