npm package: @lauthieb/kquery
Description: A simplified jQuery-like capable library, called kQuery
Author: Laurent Thiebault
Latest version: 1.0.0

# @lauthieb/kquery

> What's better than jQuery? 👉 kQuery 👈

The goal of this [assignment](https://github.com/lauthieb/kquery/blob/main/assignment.md) is to build a simplified [jQuery](https://api.jquery.com/)-like capable library, called `🎤 kQuery`.

Instead of asking you to design an API, we thought we would ask you to **implement one**. Designing an API takes time, experience, and we usually do it as a team.

## Installation 💻

With NPM:

```sh
npm i @lauthieb/kquery
```

or with a CDN:

```html
<script src="https://unpkg.com/@lauthieb/kquery@1.0.0/dist/kQuery.js"></script>
```

## Usage 🤔

```js
import kQuery from 'kquery';

kQuery('.item').replaceWith(kQuery('.itemReplacement')).style({
  color: '#000',
});
```

This gets all the [DOM elements](https://developer.mozilla.org/en-US/docs/Web/API/Element) matching the [CSS selector](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Selectors) `.item`, replaces them with all the elements matching `.itemReplacement`, and then changes the CSS `color` property of the DOM element.

## Technologies 🕹

- [typescript](https://www.typescriptlang.org/)
- [typedoc](https://typedoc.org/)
- [rollup](https://rollupjs.org/)
- [prettier](https://prettier.io/)
- [husky](https://typicode.github.io/husky)
- [lint-staged](https://github.com/okonet/lint-staged)
- [eslint](https://eslint.org/)
- [commintlint](https://commitlint.js.org/)
- [jest](https://jestjs.io/)
- [sort-package-json](https://github.com/keithamus/sort-package-json)

## API Documentation 📖

The kQuery API documentation is available [here](https://lauthieb.github.io/kquery).

## Contributing ❤️

We are thankful for any contributions from the community. Read our [contributing guide](https://github.com/lauthieb/kquery/blob/main/CONTRIBUTING.md) to learn about our development process, how to propose bugfixes and improvements, and how to build and test your changes to kQuery.

## Available Scripts ⌨️

In the project directory, you can run:

### `npm run dev`

Build the library, launch tests & serve API documentation in the development watch mode.<br>
Open [http://localhost:8080](http://localhost:8080) to view the API documentation.

### `npm run build`

Builds the library into a `dist` folder.

### `npm test`

Launches the Snapshot tests.

### `npm run docs`

Generates the API documentation into a `docs` folder.

## About the author 🙋‍♂️

I’m Laurent, Senior Frontend Engineer at [Decathlon](https://developers.decathlon.com), Founder of [Frontend Beers](https://www.meetup.com/fr-FR/frontendbeers/) & [Musician](https://www.youtube.com/watch?v=AYmeUnBfWrc) 🎵

- Website: https://lauthieb.dev
- Blog: https://blog.lauthieb.dev
- GitHub: https://github.com/lauthieb
- Twitter: https://twitter.com/lauthieb
- LinkedIn: https://www.linkedin.com/in/lauthieb/
- YouTube: https://www.youtube.com/c/lauthieb
- Current project that I lead at Decathlon, Design System: https://decathlon.design & https://github.com/Decathlon/vitamin-web
- An Open Source project that I made (800+ stars ⭐️): https://github.com/lauthieb/code-notes

## Ideas of improvement 🚀

- [ ] Add CI/CD workflows with GitHub Actions for generating documentation after merge on `main` branch & publish on NPM registry (with `npm version`, changelog auto-generated etc.)
- [ ] Setup coverage reports
- [ ] Setup Sonarcloud dashboard (w/ Pull Request analysis)
- [ ] Create live examples w/ CodePen or CodeSandbox