Git Product home page Git Product logo

generator-jhipster-svelte's Introduction

Svelte Hipster

NPM version Dependency Status code style: prettier Generated applications build status Generated applications build status Generator Build Status

Generate cybernetically enhanced JHipster Svelte web applications

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

Under active development

Following integrations are supported:

✅ Session, JWT authentication
✅ Dark Mode support
✅ SvelteKit
✅ Tailwind CSS, PurgeCSS, PostCSS integration for optimized CSS bundles
✅ Prettier, EsLint integration
✅ Cypress integration for end to end tests
✅ Jest and Testing Library integration for unit tests
✅ JHipster application JDL

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

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

Technical Stack

Svelte JS Tailwind CSS Font Awesome Cypress Jest Testing Library Prettier ESLint Vite

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
  • 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
        }
    }
    

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

    shipster import-jdl app.jdl
  • 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

JHipster Compatibility Matrix

JHipster Svelte Hipster
6.10.5 0.1 - 0.2.1
7.0.0 >= 0.3

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
    • 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

    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

Pull requests are encouraged and always welcome.

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

generator-jhipster-svelte's People

Contributors

danielfran avatar dependabot[bot] avatar jdubois avatar pascalgrimaud avatar rajpratik71 avatar vishal423 avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.