jhipster/svelte-hipster repository overview

⁠Svelte Hipster

⁠Introduction

This is a JHipster⁠ blueprint, that intends to use SvelteKit⁠ / Svelte⁠ as the client side development framework.

⁠What's new

Refer to the changelog⁠ to gain more insights into each release details.

⁠Supported flows and integrations

Following integrations are supported:

✅ Session, JWT, OIDC authentication
✅ Dark Mode support
✅ SvelteKit, Vite integration
✅ Tailwind CSS
✅ Prettier, EsLint integration
✅ Cypress integration for end to end tests
✅ Jest and Testing Library integration for unit tests
✅ JHipster application JDL
✅ JHipster entity JDL (simple data type, no relation)
✅ JHipster elasticsearch integration

Following functional flows are covered with end to end tests:

✅ Sign in
✅ Sign up
✅ Forgot Password
✅ Home
✅ Account
    ✅ Change Password
    ✅ Settings
    ✅ Sign out
✅ Administration
    ✅ User Management (List, Create, Update, View, Delete)
    ✅ Loggers
✅ Entities
    ✅ Entity (List, View, Delete, Search, Pagination)

For more details, you can check out the source code of sample application⁠

⁠Technical Stack

⁠Installation

To install the blueprint, run below command:

npm install -g generator-jhipster-svelte

To update the blueprint, run below command:

npm update -g generator-jhipster-svelte

⁠Usage

• Svelte Hipster blueprint exposes a cli to use the correct version of JHipster. Run the below command to generate new applications (interactive approach):

  shipster
  

  Copy

• Alternatively, you can also use the application JDL to generate new applications (config approach). Refer to JDL application⁠ documentation for all supported options.

  Create a new application JDL like below and save it in a file (app.jdl in this example):

  application {
      config {
          baseName SampleBlogApp,
          applicationType monolith,
          authenticationType session,
          packageName tech.jhipster.samples.blog,
          prodDatabaseType postgresql,
          cacheProvider caffeine,
          buildTool maven
      }
      entities *
  }
  
  entity Blog {
      name String required minlength(3)
      handle String required minlength(2)
  }
  
  entity Tag {
      name String required minlength(3)
  }
  
  paginate Tag with pagination
  

  Copy

  Pass import-jdl option along the file path to shipster cli to generate new application:

  shipster import-jdl app.jdl
  

  Copy

• If you have already setup JHipster⁠ on your workstation, then, run the below command (it overrides to use the global JHipster version). Be cautious to use compatible Svelte Hipster and JHipster versions.

  jhipster --blueprints svelte
  

  Copy

⁠JHipster Compatibility Matrix

⁠Docker development

Svelte Hipster docker images are available at DockerHub⁠

To develop against the latest published release, follow below steps:

• Pull the Svelte Hipster docker image:

docker pull jhipster/svelte-hipster

In case, you want to try out the latest code (unpublished), then, pull the image with main tag as:

docker pull jhipster/svelte-hipster:main

• Create a new directory for your application and run the below command to generate the application:

mkdir svelte-app && cd svelte-app

docker run -it --rm -v $PWD:/app jhipster/svelte-hipster

• You can also run the generated application from within the container. Following examples consider maven as the build tool:

  • To run unit test cases, use the command:

  docker run -it --rm -v $PWD:/app -v ~/.m2:/home/shipster/.m2 --entrypoint ./mvnw jhipster/svelte-hipster clean test
  

  Copy
  • To start the application using the default dev profile, use the command:

  docker run -it --rm -v $PWD:/app -v ~/.m2:/home/shipster/.m2 -p 8080:8080 --entrypoint ./mvnw jhipster/svelte-hipster -DskipTests
  

  Copy

  Access application with http://localhost:8080/⁠

• If you would like to access the container file system, you can also attach a bourne shell:

docker run -it --rm -v $PWD:/app -v ~/.m2:/home/shipster/.m2 --entrypoint sh jhipster/svelte-hipster

⁠🛠️ Local Development

To setup your development environment, follow below steps:

1. Link svelte blueprint globally:

cd generator-jhipster-svelte
npm link

1. Link a development version of JHipster to your blueprint (optional: required only if you want to use a non-released JHipster version, like the main branch or your own custom fork)

cd generator-jhipster
npm link

cd generator-jhipster-svelte
npm link generator-jhipster

1. Create a new directory for your application and link JHipster and svelte blueprint.

mkdir my-app && cd my-app

npm link generator-jhipster-svelte
npm link generator-jhipster (Optional: Needed only if you are using a non-released JHipster version)

shipster

⁠License

Apache-2.0 © Vishal Mahajan⁠