{"id":14984125,"url":"https://github.com/t34-dev/ts-package-starter","last_synced_at":"2025-04-10T19:51:56.321Z","repository":{"id":251024528,"uuid":"836160417","full_name":"t34-dev/ts-package-starter","owner":"t34-dev","description":"A universal TypeScript package template for creating libraries compatible with React, Node.js, and web projects","archived":false,"fork":false,"pushed_at":"2024-08-05T14:18:14.000Z","size":64,"stargazers_count":2,"open_issues_count":0,"forks_count":1,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-20T03:05:10.114Z","etag":null,"topics":["eslint","node","package","prettier","react","starter","ts","typescript","web"],"latest_commit_sha":null,"homepage":"https://t34-dev.github.io/ts-package-starter/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"isc","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/t34-dev.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-07-31T09:18:31.000Z","updated_at":"2024-10-14T13:15:49.000Z","dependencies_parsed_at":"2024-08-02T10:43:25.962Z","dependency_job_id":"a2d66c57-41f3-44b5-b76e-98b1fd888a49","html_url":"https://github.com/t34-dev/ts-package-starter","commit_stats":{"total_commits":15,"total_committers":3,"mean_commits":5.0,"dds":"0.19999999999999996","last_synced_commit":"3a54647ef680691032fbd04ebe3227220763f207"},"previous_names":["well-do-it-too/ts-universal-package","t34-dev/ts-package-starter","t34-developer/ts-package-starter"],"tags_count":21,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/t34-dev%2Fts-package-starter","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/t34-dev%2Fts-package-starter/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/t34-dev%2Fts-package-starter/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/t34-dev%2Fts-package-starter/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/t34-dev","download_url":"https://codeload.github.com/t34-dev/ts-package-starter/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248283846,"owners_count":21077934,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["eslint","node","package","prettier","react","starter","ts","typescript","web"],"created_at":"2024-09-24T14:08:29.566Z","updated_at":"2025-04-10T19:51:56.299Z","avatar_url":"https://github.com/t34-dev.png","language":"JavaScript","readme":"[![ISC License](http://img.shields.io/badge/license-ISC-blue.svg)](http://copyfree.org)\n![TypeScript](https://img.shields.io/badge/TypeScript-5.5.3-blue?logo=typescript\u0026ver=1722867494)\n![Node.js](https://img.shields.io/badge/Node.js-%3E%3D20-green?logo=node.js\u0026ver=1722867494)\n![GitHub release (latest by date)](https://img.shields.io/github/v/release/t34-dev/ts-package-starter?ver=1722867494)\n![GitHub tag (latest by date)](https://img.shields.io/github/v/tag/t34-dev/ts-package-starter?sort=semver\u0026style=flat\u0026logo=git\u0026logoColor=white\u0026label=Latest%20Version\u0026color=blue\u0026ver=1722867494)\n\n# ts-package-starter\n\nA universal TypeScript package template for creating libraries that can be used in React, Node.js, and web projects.\n\n## Features\n\n- TypeScript support\n- Compatible with browser and Node.js environments\n- Easy to use and extend\n- Includes example functions\n- Configured with ESLint, Prettier, and Husky for code quality\n- Uses Rollup for building and bundling\n- Vitest for testing\n\n## Demo\n\nYou can see a live demo of this package in action at our [GitHub Pages demo site](https://t34-dev.github.io/ts-package-starter/).\n\nThis demo showcases the basic functionality of the package, including:\n- Greeting function\n- Number doubling function\n- Package name retrieval\n\nFeel free to inspect the source code of the demo page for an example of how to integrate this package into your web projects.\n\n## Installation\n\n```bash\nnpm install @t34-dev/ts-package-starter\n```\n\n## Usage\n\n### In a TypeScript/JavaScript project\n\n```typescript\nimport { greet, doubleNumber, getMyName } from '@t34-dev/ts-package-starter';\n\nconsole.log(greet('World')); // Output: Hello, World!\nconsole.log(doubleNumber(5)); // Output: 10\nconsole.log(getMyName()); // Output: Well Do It Too\n```\n\n### In a browser\n\n```html\n\u003c!DOCTYPE html\u003e\n\u003chtml lang=\"en\"\u003e\n\u003chead\u003e\n    \u003cmeta charset=\"UTF-8\"\u003e\n    \u003cmeta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\"\u003e\n    \u003ctitle\u003eUniversal Package Demo\u003c/title\u003e\n\u003c/head\u003e\n\u003cbody\u003e\n    \u003ch1\u003eUniversal Package Demo\u003c/h1\u003e\n    \u003cdiv id=\"result\"\u003e\u003c/div\u003e\n\n    \u003cscript src=\"https://unpkg.com/@t34-dev/ts-package-starter\"\u003e\u003c/script\u003e\n    \u003cscript\u003e\n        const resultDiv = document.getElementById('result');\n        const greeting = welldoittoo.greet('Browser');\n        const doubledNumber = welldoittoo.doubleNumber(21);\n        const name = welldoittoo.getMyName();\n\n        resultDiv.innerHTML = `\n            \u003cp\u003e${greeting}\u003c/p\u003e\n            \u003cp\u003eDouble of 21 is: ${doubledNumber}\u003c/p\u003e\n            \u003cp\u003eName: ${name}\u003c/p\u003e\n        `;\n    \u003c/script\u003e\n\u003c/body\u003e\n\u003c/html\u003e\n```\n\n## Integration Guide\n\n### React Project\n\n1. Install the package:\n   ```bash\n   npm install @t34-dev/ts-package-starter\n   ```\n\n2. Import and use in your React component:\n   ```jsx\n   import React from 'react';\n   import { greet, doubleNumber } from '@t34-dev/ts-package-starter';\n\n   function MyComponent() {\n     return (\n       \u003cdiv\u003e\n         \u003ch1\u003e{greet('React')}\u003c/h1\u003e\n         \u003cp\u003eDouble of 10 is: {doubleNumber(10)}\u003c/p\u003e\n       \u003c/div\u003e\n     );\n   }\n\n   export default MyComponent;\n   ```\n\n### Node.js Project\n\n1. Install the package:\n   ```bash\n   npm install @t34-dev/ts-package-starter\n   ```\n\n2. Use in your Node.js script:\n   ```javascript\n   const { greet, doubleNumber } = require('@t34-dev/ts-package-starter');\n\n   console.log(greet('Node.js'));\n   console.log(`Double of 7 is: ${doubleNumber(7)}`);\n   ```\n\n### Web Project (via CDN)\n\nYou can include the package directly in your HTML file using a CDN:\n\n```html\n\u003c!DOCTYPE html\u003e\n\u003chtml lang=\"en\"\u003e\n\u003chead\u003e\n    \u003cmeta charset=\"UTF-8\"\u003e\n    \u003cmeta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\"\u003e\n    \u003ctitle\u003eWeb Project Demo\u003c/title\u003e\n\u003c/head\u003e\n\u003cbody\u003e\n    \u003cdiv id=\"result\"\u003e\u003c/div\u003e\n\n    \u003cscript src=\"https://unpkg.com/@t34-dev/ts-package-starter\"\u003e\u003c/script\u003e\n    \u003cscript\u003e\n        const { greet, doubleNumber } = welldoittoo;\n        \n        const resultDiv = document.getElementById('result');\n        resultDiv.innerHTML = `\n            \u003ch1\u003e${greet('Web')}\u003c/h1\u003e\n            \u003cp\u003eDouble of 15 is: ${doubleNumber(15)}\u003c/p\u003e\n        `;\n    \u003c/script\u003e\n\u003c/body\u003e\n\u003c/html\u003e\n```\n\n## Examples\n\nYou can find example usage of this package in the `example/` directory of this repository. This includes:\n\n- Basic HTML usage\n- Node.js script example\n- React component example\n\nTo run the examples locally:\n\n1. Clone the repository\n2. Navigate to the `example/` directory\n3. Open the HTML file in a browser or run the Node.js script\n\n## Development\n\n1. Clone the repository:\n   ```bash\n   git clone https://github.com/t34-dev/ts-package-starter.git\n   cd ts-package-starter\n   ```\n\n2. Install dependencies:\n   ```bash\n   pnpm install\n   ```\n\n3. Run tests:\n   ```bash\n   pnpm test\n   ```\n\n4. Build the package:\n   ```bash\n   pnpm build\n   ```\n\n5. Run pre-commit checks:\n   ```bash\n   pnpm pre-commit\n   ```\n\n### Using Make commands\n\nRun these commands with `make \u003ccommand\u003e`:\n\n- `make` or `make help`: Shows all available Make commands.\n- `make rmdist`: Removes the dist folder.\n- `make build`: Builds the project (includes removing dist folder).\n- `make test`: Runs the test suite.\n- `make version-up`: Updates the project version.\n- `make pre`: Runs pre-commit checks.\n\n#### Git Tag Management\n\nThe project includes additional commands for managing Git tags:\n\n- `make tag`: Displays the latest Git tag.\n- `make tag-new`: Displays the next Git tag that would be created.\n- `make tag-up`: Creates and pushes a new Git tag. Note: This command can only be run from the 'main' branch.\n\n\n## Scripts\n\n- `pnpm clean`: Remove node_modules and pnpm-lock.yaml\n- `pnpm rmdist`: Remove the dist folder\n- `pnpm build`: Build the package\n- `pnpm test`: Run tests\n- `pnpm lint`: Run ESLint\n- `pnpm format`: Format code with Prettier\n- `pnpm check`: Run linter and Prettier checks\n- `pnpm version-up`: Update package version\n- `pnpm pre-commit`: Run pre-commit checks\n\n## Contributing\n\nContributions are welcome! Please feel free to submit a Pull Request.\n\n## License\n\nThis project is licensed under the ISC License.\n\n## Links\n\n- [GitHub Repository](https://github.com/t34-dev/ts-package-starter)\n- [npm Package](https://www.npmjs.com/package/@t34-dev/ts-package-starter)\n- [Demo](https://t34-dev.github.io/ts-package-starter/)\n\n---\n\nDeveloped with ❤️ by [T34](https://github.com/t34-dev)\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ft34-dev%2Fts-package-starter","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ft34-dev%2Fts-package-starter","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ft34-dev%2Fts-package-starter/lists"}