{"id":20943337,"url":"https://github.com/apillon/apillon-app","last_synced_at":"2026-02-07T03:30:54.906Z","repository":{"id":232603945,"uuid":"619822627","full_name":"Apillon/apillon-app","owner":"Apillon","description":"Dashboard frontend","archived":false,"fork":false,"pushed_at":"2024-11-06T08:18:14.000Z","size":12272,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"master","last_synced_at":"2025-01-19T21:22:50.178Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"Vue","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"gpl-3.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Apillon.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE.md","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":"2023-03-27T13:51:52.000Z","updated_at":"2024-11-06T08:19:03.000Z","dependencies_parsed_at":"2024-04-10T17:05:34.662Z","dependency_job_id":"4e55b71c-96f9-415a-afb1-6cca7fea69e5","html_url":"https://github.com/Apillon/apillon-app","commit_stats":null,"previous_names":["apillon/apillon-app"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Apillon%2Fapillon-app","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Apillon%2Fapillon-app/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Apillon%2Fapillon-app/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Apillon%2Fapillon-app/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Apillon","download_url":"https://codeload.github.com/Apillon/apillon-app/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243335462,"owners_count":20274904,"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":[],"created_at":"2024-11-18T23:35:58.444Z","updated_at":"2026-02-07T03:30:54.900Z","avatar_url":"https://github.com/Apillon.png","language":"Vue","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Apillon - A Web3 development platform\n\nThis repository contains source code for the Dashboard frontend.\n\n## Stack\n\n- node 20.8.1\n- Nuxt 3\n- Vue 3 w/ TypeScript\n- Pinia Store\n- NaiveUI\n- TailwindCSS\n- Wagmi \u0026 viem\n\n## Info\n\n### API\n\nAPI interaction should be done with `fetch` api wrapper. Globally imported as `$api`.\n\n```js\nawait $api.get('/login', formData);\n```\n\n### Blockchain\n\nBlockchain connection is realized with [viem](https://viem.sh/) and [wagmi](https://github.com/wagmi-dev/wagmi). For easier integration, a vue wrapper is used: [wagmi/vue](https://github.com/unicape/wagmi/vue). Docs for react hooks work with wagmi/vue: [https://wagmi.sh/react/hooks/useAccount](https://wagmi.sh/react/hooks/useAccount).\n\nWagmi config is in `~/plugins/wagmi/vue.ts`. Connectors, available chains and RPC urls can be defined here.\n\n### Error handling\n\nErrors are handled with the global function `userFriendlyMsg` and displayed as toast message with Naive UI. Error messages need to be translated, so error messages are written to `~/locales/en.json`\n\n```js\n  } catch (error) {\n    message.error(userFriendlyMsg(error));\n  }\n```\n\n### Vueuse\n\nMany common tasks can be solved with using helper functions from [vueuse](https://vueuse.org/functions.html). Use those instead of reinventing the wheel.\n\neg.\n\n```js\nuseIntersectionObserver();\nuseInfiniteScroll();\nuseScroll();\nuseScrollLock();\n```\n\n### Images\n\nUse `\u003cImage /\u003e` component to lazy load images. Implements [v-lazy-image](https://github.com/alexjoverm/v-lazy-image). `:src` can be link to (eg. public assets `./images/test.png`), or image imported as module.\n\nFor images that dont need lazy load, use html `\u003cimg\u003e`. The `:src` can then also be provided with resolve token (eg. `~/assets/images/test.png`).\n\n```html\n\u003cscript\u003e\n  import imgTest from '~/assets/images/test.png';\n\u003c/script\u003e\n\n\u003cimage :src=\"imgTest\" width=\"1436\" height=\"1513\" /\u003e\n\n\u003cimage src=\"./images/test.png\" width=\"1436\" height=\"1513\" /\u003e\n\n\u003cimg src=\"~/assets/images/test.png\" width=\"1436\" height=\"1513\" /\u003e\n```\n\n### Icons\n\nAdd icon svg to `/assets/icons`, then use `\u003cNuxtIcon :name=\"\" /\u003e` component to use the icon - set name prop to filename. Implements [nuxt-icons](https://github.com/gitFoxCode/nuxt-icons).\n\nControl size with font-size.\n\n```html\n\u003cNuxtIcon name=\"larr\" class=\"inline-block text-[18px] mr-3 align-middle\" /\u003e\n```\n\n### Icons (Icomoon)\n\nTo open and edit icons from font Apillon, open (https://icomoon.io/app/#/select) and import file 'assets\\css\\fonts\\apillon\\selection.json'.\n\nControl size with font-size and color.\n\n```html\n\u003cspan class=\"icon-${iconName} text-xl mr-2\"\u003e\u003c/span\u003e\n```\n\n### Breakpoints\n\nFor basic styles, use tailwind breakpoint system. For js usage, use `useScreen` composable.\n\n```js\nconst screens = reactive(useScreen());\n// or\nconst { isXl } = useScreen();\n```\n\n```html\n\u003cdiv v-if=\"screens.isXl\" class=\"w-8 h-8 bg-red\"\u003e\u003c/div\u003e\n\u003cdiv v-else class=\"w-8 h-8 bg-blue\"\u003e\u003c/div\u003e\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fapillon%2Fapillon-app","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fapillon%2Fapillon-app","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fapillon%2Fapillon-app/lists"}