<commit_before># Semantic UI, React, and TypeScript Examples

Several examples built with [Semantic UI](https://react.semantic-ui.com/), [React](https://facebook.github.io/react/), and [TypeScript](https://www.typescriptlang.org/).

Each example was created with [create-react-app](https://www.npmjs.com/package/create-react-app) and [react-scripts-ts](https://www.npmjs.com/package/react-scripts-ts) using the following command:

``` bash
create-react-app my-app --scripts-version=react-scripts-ts
```

For local development, run `npm start` in the root directory of any of these examples, and it will automatically start a server, launch the example in your browser, and watch for changes.

## [Magic 8-Ball Chat](http://joshtynjala.github.io/semantic-ui-react-typescript-examples/magic-eight-ball-chat/)

Ask a yes or no question to the magic 8-ball and it will give you an answer. Styled like a chat application.

* [Run Magic 8-Ball Chat example](http://joshtynjala.github.io/semantic-ui-react-typescript-examples/magic-eight-ball-chat/)

## [Loan Payment Calculator](http://joshtynjala.github.io/semantic-ui-react-typescript-examples/loan-payment-calculator/)

Change the the principal, the interest rate, and the number of years required to pay back the loan to calculate your monthly payment. Includes a custom NumericStepper component.

* [Run Loan Payment Calculator example](http://joshtynjala.github.io/semantic-ui-react-typescript-examples/loan-payment-calculator/)

## [Todos](http://joshtynjala.github.io/semantic-ui-react-typescript-examples/todos/)

Keep track of a list of things you need to do. Add items, check them when completed, and clear all completed items. Displayed in a Card component.

* [Run Todos example](http://joshtynjala.github.io/semantic-ui-react-typescript-examples/todos/)<commit_msg>README: updated readme with more instructions<commit_after># Semantic UI, React, and TypeScript Examples

Several examples built with [Semantic UI](https://react.semantic-ui.com/), [React](https://facebook.github.io/react/), and [TypeScript](https://www.typescriptlang.org/).

Each example was created with [create-react-app](https://www.npmjs.com/package/create-react-app) and [react-scripts-ts](https://www.npmjs.com/package/react-scripts-ts) using the following command:

``` bash
create-react-app my-app --scripts-version=react-scripts-ts
```

For local development, run `npm start` in the root directory of any of these examples, and it will automatically start a server, launch the example in your browser, and watch for any changes that you make to the code. The page will reload with your changes automatically!

## [Magic 8-Ball Chat](http://joshtynjala.github.io/semantic-ui-react-typescript-examples/magic-eight-ball-chat/)

Ask a yes or no question to the magic 8-ball and it will give you an answer. Styled like a chat application.

* [Run Magic 8-Ball Chat example](http://joshtynjala.github.io/semantic-ui-react-typescript-examples/magic-eight-ball-chat/)

## [Loan Payment Calculator](http://joshtynjala.github.io/semantic-ui-react-typescript-examples/loan-payment-calculator/)

Change the the principal, the interest rate, and the number of years required to pay back the loan to calculate your monthly payment. Includes a custom NumericStepper component.

* [Run Loan Payment Calculator example](http://joshtynjala.github.io/semantic-ui-react-typescript-examples/loan-payment-calculator/)

## [Todos](http://joshtynjala.github.io/semantic-ui-react-typescript-examples/todos/)

Keep track of a list of things you need to do. Add items, check them when completed, and clear all completed items. Displayed in a Card component.

* [Run Todos example](http://joshtynjala.github.io/semantic-ui-react-typescript-examples/todos/)
{'fraction_non_alphanumeric': 0.1190855927698033, 'fraction_numerical': 0.001594896331738437, 'mean_word_length': 4.798151001540832, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, 'https://': 10, 'lorem ipsum': 0, 'www.': 6, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '392216', 'n_tokens_mistral': 1174, 'n_tokens_neox': 1108, 'n_words': 341}