{"id":24678302,"url":"https://github.com/firstclasspostcodes/firstclasspostcodes-vue","last_synced_at":"2025-07-06T12:34:55.895Z","repository":{"id":54788065,"uuid":"256257818","full_name":"firstclasspostcodes/firstclasspostcodes-vue","owner":"firstclasspostcodes","description":"An extensible React component enabling UK postcode lookup, via the First Class Postcode API.","archived":false,"fork":false,"pushed_at":"2021-01-29T07:13:29.000Z","size":6108,"stargazers_count":0,"open_issues_count":11,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-03-17T22:56:24.951Z","etag":null,"topics":["address","javascript","vue"],"latest_commit_sha":null,"homepage":"","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/firstclasspostcodes.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}},"created_at":"2020-04-16T15:38:34.000Z","updated_at":"2020-11-13T07:54:03.000Z","dependencies_parsed_at":"2022-08-14T03:00:37.963Z","dependency_job_id":null,"html_url":"https://github.com/firstclasspostcodes/firstclasspostcodes-vue","commit_stats":null,"previous_names":[],"tags_count":1,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/firstclasspostcodes%2Ffirstclasspostcodes-vue","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/firstclasspostcodes%2Ffirstclasspostcodes-vue/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/firstclasspostcodes%2Ffirstclasspostcodes-vue/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/firstclasspostcodes%2Ffirstclasspostcodes-vue/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/firstclasspostcodes","download_url":"https://codeload.github.com/firstclasspostcodes/firstclasspostcodes-vue/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":244845400,"owners_count":20519954,"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":["address","javascript","vue"],"created_at":"2025-01-26T13:16:35.715Z","updated_at":"2025-03-21T18:23:33.852Z","avatar_url":"https://github.com/firstclasspostcodes.png","language":"JavaScript","readme":"# Firstclasspostcodes\n![Build Package](https://github.com/firstclasspostcodes/firstclasspostcodes-vue/workflows/Build%20Package/badge.svg) [![Cypress Dashboard](https://img.shields.io/badge/cypress-dashboard-brightgreen.svg)](https://dashboard.cypress.io/projects/7ns8he/runs)\n\nWe've designed our [Vue](https://vuejs.org) component library to be as flexible as possible enabling you to quickly configure build or enhance any form with postcode lookup.\n\n## Documentation\nSee [@firstclasspostcodes/vue](https://docs.firstclasspostcodes.com/js/vue) for detailed usage, guides and examples.\n\n## Installation\nInstall the package with:\n\n```\nnpm install @firstclasspostcodes/vue -s\n```\n\nonce installed, import the components inside `src/main.js`:\n\n```js\nimport Vue from 'vue';\nimport App from './App.vue';\n\n// add global components\nimport '@firstclasspostcodes/vue';\n\nnew Vue({ render: h =\u003e h(App) }).$mount('#app');\n```\n\nNow, you can add the components to any Vue component:\n\n```jsx\n\u003ctemplate\u003e\n  \u003cdiv\u003e\n    \u003cpostcode-lookup apiKey=\"12345678909\" /\u003e\n  \u003c/div\u003e\n\u003c/template\u003e\n```\n\nFor more guides and information on how to configure and use the components, [read our documentation](https://docs.firstclasspostcodes.com/js/vue).\n\n## Development\nThe library is built off the back of `vue-cli-service` and we stick to the paved road.\n\n### Getting started\nRun the mock API container, this will provide some data you can develop \u0026 test with locally:\n\n```\ndocker run --rm -d -p 2345:80 firstclasspostcodes/mock:latest\n```\n\nAdd necessary configuration to a `.env` file:\n\n```sh\n# .env\nVUE_APP_API_KEY=111111111111\nVUE_APP_API_ENDPOINT=http://localhost:2345\n```\n\nFor development, we run a \"test app\" locally, which is configured and set up in `src/App.vue`. The intention of this app is to provide some visual feedback for the library and allows for experimental usage. Most importantly, it is the page used by Cypress for integration testing.\n\nStart the development app:\n\n```\nnpm run serve\n```\n\n### Testing\nAll changes to modules should be accompanied with matching tests and functional changes should have accompanying integration tests, written using Cypress.\n\nRun the tests:\n\n```\nnpm test \u0026\u0026 npm run lint\n```\n\n### Cypress\nProvide necessary Cypress variables to run the testing suite:\n\n**Headless:**\n\n```\nCYPRESS_API_URL=http://localhost:2345 CYPRESS_API_KEY=111111111111 npm run test:e2e\n```\n\n**Interactively:**\n\n```\nCYPRESS_API_URL=http://localhost:2345 CYPRESS_API_KEY=111111111111 npx cypress open\n```","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffirstclasspostcodes%2Ffirstclasspostcodes-vue","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffirstclasspostcodes%2Ffirstclasspostcodes-vue","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffirstclasspostcodes%2Ffirstclasspostcodes-vue/lists"}