Alurkerja Fe Lowcode

Tech Stack

Client: React, React-Router-Dom v6, Typescript, Vite v3

Testing: Vitest, Testing-library

Code Quality: Eslint, Prettier, Airbnb Style Guides

Use in Project Guideline

  yarn add alurkerja-fe-low-code
  yarn add -D @tailwindcss/forms
  yarn add -D tailwind-scrollbar

on tailwind.config.cjs:

module.exports = {
  content: [...defaultContent, './node_modules/alurkerja-fe-lowcode/dist/*.{js,ts,jsx,tsx}'],
  theme: {
    extend: {},
  },
  plugins: [
    require('@tailwindcss/forms')({
      strategy: 'class',
    }),
    require('tailwind-scrollbar')({ nocompatible: true }),
  ],
}

import style on root file of project

import 'alurkerja-react-lowcode/dist/style.css'

Customize

Custom style with context

create new file, and set available variabel with tailwind class

import { BaseThemeInterface, TailwindTheme } from 'alurkerja-react-lowcode'

const newTheme: BaseThemeInterface = {
  ...TailwindTheme,
  // eg
  buttonCreate: 'text-red-400',
}

export default newTheme

on AlurkerjaContext.Provider update themeConfig, and it will overide base style

<AlurkerjaContext.Provider
    value={{
      themeConfig: newTheme,
    }}
  >

Development

Running in Local

Clone the project

  git clone ssh://[email protected]:2229/internal-growth/lowcode/alurkerja-fe-lowcode.git
  cd alurkerja-fe-lowcode
  yarn install

Start the server

  yarn dev

Running Tests

To run tests, run the following command

  yarn test

For Coverage

  yarn coverage

Versioning (Build & Publish)

Build

Build first before publishing

  yarn build

Publish

to help switching npmjs account use npm-user-switch

Update version patch (0.0.x)

  yarn publish --patch

Update version minor (0.x.0)

  yarn publish --minor

Update version major (x.0.0)

  yarn publish --major