{"id":15736733,"url":"https://github.com/oklas/component-intl-welcome","last_synced_at":"2025-06-17T22:04:34.674Z","repository":{"id":57204755,"uuid":"86152959","full_name":"oklas/component-intl-welcome","owner":"oklas","description":"Example of component library according to Component Approach to Internationalization","archived":false,"fork":false,"pushed_at":"2017-03-31T21:58:18.000Z","size":25,"stargazers_count":0,"open_issues_count":0,"forks_count":1,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-03-31T04:41:13.744Z","etag":null,"topics":["component","i18n","internationalization","intl","join","loader","locale","localization","merge","plugin"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/oklas.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-03-25T11:37:09.000Z","updated_at":"2017-04-03T18:00:24.000Z","dependencies_parsed_at":"2022-09-18T00:42:10.158Z","dependency_job_id":null,"html_url":"https://github.com/oklas/component-intl-welcome","commit_stats":null,"previous_names":[],"tags_count":1,"template":false,"template_full_name":null,"purl":"pkg:github/oklas/component-intl-welcome","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oklas%2Fcomponent-intl-welcome","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oklas%2Fcomponent-intl-welcome/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oklas%2Fcomponent-intl-welcome/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oklas%2Fcomponent-intl-welcome/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/oklas","download_url":"https://codeload.github.com/oklas/component-intl-welcome/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oklas%2Fcomponent-intl-welcome/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":260447651,"owners_count":23010542,"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":["component","i18n","internationalization","intl","join","loader","locale","localization","merge","plugin"],"created_at":"2024-10-04T01:41:15.748Z","updated_at":"2025-06-17T22:04:29.658Z","avatar_url":"https://github.com/oklas.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Demonstration component 'Welcome' with locales\n\nThis is exampe library with support of internationalization according to\n**[component approach](https://github.com/oklas/component-intl)**\n\nThis library exports a demonstration component **'Welcome'** which uses\n[react-intl](https://github.com/yahoo/react-intl) internationalization\nlibrary. The component displays a simple form and displays a localized\nsentence in the selected language. The sentence is reactively changing\nin response to a change of the data in the form.\n\nThis demonstration component currently support `en`, `de`, `ru`, `zh` locales.\n\nThe localization data is in directory [./locales](./locales) in yaml\nformat according to component approach\n\nTo integrate localization data to application locale assets configure\nthe [webpack](https://webpack.js.org/) internationalization plugin\n[intl-webpack-plugin](https://github.com/oklas/intl-webpack-plugin)\nlike this:\n\n``` javascript\n  var IntlPlugin = require(\"intl-webpack-plugin\");\n  module: {\n    rules: [\n      { test: /\\.(intl)$/i,\n        use: [\n          IntlPlugin.loader(),\n          'yaml-loader'\n        ]\n      }\n    ]\n  }\n  plugins: [\n    new IntlPlugin({})\n  ]\n\n```\n\nAnd require internationalization entry point module somewhere in application:\n\n``` javascript\nimport {} from 'component-intl-welcome/locales'\n```\n\nNow import component and put it on the page like this:\n\n``` javascript\nimport React from 'react'\n\nimport Welcome from 'component-intl-welcome'\nimport {} from 'component-intl-welcome/locales'\n\nconst App = (props) =\u003e (\n  \u003cdiv\u003e\n    \u003ch2\u003eThe \"Welcome\" component\u003c/h2\u003e\n    \u003cWelcome/\u003e\n  \u003c/div\u003e\n)\n\n```\n\n\nTo see example how to integrate this library component with locales into\napplication and how it works see\n\n * the running [demonstration application](https://oklas.github.io/component-intl-example/)\n\nor its source code:\n\n * [component-intl-example](https://github.com/oklas/component-intl-example/)","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Foklas%2Fcomponent-intl-welcome","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Foklas%2Fcomponent-intl-welcome","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Foklas%2Fcomponent-intl-welcome/lists"}