{"id":27128456,"url":"https://github.com/akronae/kolivads","last_synced_at":"2025-07-17T00:06:15.169Z","repository":{"id":44413813,"uuid":"512239527","full_name":"Akronae/kolivads","owner":"Akronae","description":"Technical test project 👷‍♂️","archived":false,"fork":false,"pushed_at":"2022-07-29T10:52:11.000Z","size":3584,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-07-10T14:55:31.836Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Akronae.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2022-07-09T16:56:50.000Z","updated_at":"2022-07-09T17:01:39.000Z","dependencies_parsed_at":"2022-08-19T00:01:31.390Z","dependency_job_id":null,"html_url":"https://github.com/Akronae/kolivads","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/Akronae/kolivads","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Akronae%2Fkolivads","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Akronae%2Fkolivads/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Akronae%2Fkolivads/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Akronae%2Fkolivads/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Akronae","download_url":"https://codeload.github.com/Akronae/kolivads/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Akronae%2Fkolivads/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":265553240,"owners_count":23787038,"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":"2025-04-07T18:58:01.637Z","updated_at":"2025-07-17T00:06:15.089Z","avatar_url":"https://github.com/Akronae.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Kolivads\n\u003e ## 🏡 A technical project to manage real estate ads and clients  \n\n\u003cimg src=\"https://i.imgur.com/wzJ2wKb.png\" /\u003e\n\n# Installation\n## Docker\n#### Requires [`docker`](https://docs.docker.com/engine/install/#server) and [docker-compose](https://docs.docker.com/compose/install/compose-plugin/)\n\n```bash\ngit clone https://www.github.com/Akronae/kolivads\ncd kolivads\ndocker-compose up -d\n```\n✨ The projet is running at http://localhost:3000\n\n## Manual\nRequires [Node.js](https://github.com/nvm-sh/nvm) and an instance of [MongoDB](https://www.mongodb.com/docs/manual/installation/) running ([MongoDB Atlas](https://www.mongodb.com/atlas/database) is recommended).\n\nClone the project:\n```bash\ngit clone https://www.github.com/Akronae/kolivads\ncd kolivads\nnpm i -g yarn\n```\n```bash\ncd ./api\n```\nEdit `.env` according to your MongoDB instance\n```bash\ncp ./.env.example ./.env\n./.env\n```\nRun the API\n```bash\nnpm install --legacy-peer-deps\nnpm run start\n```\nIn another terminal, run the client\n```bash\ncd ./client\nnpm install --legacy-peer-deps\nnpm run start\n```\n\n✨ The projet is running at http://localhost:3000\n\n## Technical Specifications\n### **Server**\nDatabase tables stick to the codebase implementation with [typegoose](https://typegoose.github.io/typegoose/docs/guides/quick-start-guide)\n\u003e `api/src/entities/Client.ts`\n```ts\n@plugin(AutoIncrementID)\n@ObjectType()\nexport class Client {\n  // default MongoDB ID field, cannot be changed.\n  @prop()\n  readonly _id!: number;\n\n  // publicly available ID field.\n  @Field()\n  get id(): number {\n    return this._id;\n  }\n\n  @prop()\n  @Field()\n  @IsPhoneNumber('FR')\n  phone!: string;\n\n  ...\n```\nHandling GraphQL queries is easy and clean with [type-graphql](https://typegraphql.com/)\n\u003e `api/src/modules/property/resolver.ts`\n```ts\n@Service()\n@Resolver((of) =\u003e Property)\nexport default class PropertyResolver {\n  constructor(private readonly propertyService: PropertyService) {}\n\n  @Query((returns) =\u003e [Property])\n  async getProperties(\n    @Arg(\"filter\", { nullable: true }) filter: PropertyFilterInput\n  ) {\n    return await this.propertyService.get(filter);\n  }\n\n  @Mutation((returns) =\u003e [Property])\n  async createProperties(\n    @Arg(\"data\", type =\u003e [PropertyCreateInput]) data: PropertyCreateInput[]\n  ): Promise\u003cProperty[]\u003e {\n    return await this.propertyService.add(data);\n  }\n\n  ...\n```\n### **Client**  \nGraphQL queries are built with a custom query builder which uses identifier names instead of litterals, making use of auto completion, linting and safe refactoring.\n\u003e `client/src/app/components/PropertyCard.tsx`\n```tsx\nexport function PropertyCard() {\n  ...\n  const landlordsQuery = useSingleQuery(\n    new GqlBuilder\u003cProperty\u003e(PropertyOperation.Get)\n      .addArgument(\n        'filter',\n        new GqlVariable('filter', nameof\u003cPropertyFilterInput\u003e()),\n      )\n      .select(p =\u003e p.landlord),\n  );\n\n  ...\n\n  \u003cStat\n    model={modelOf(nameof.full\u003cProperty\u003e(p =\u003e p.landlord))}\n    type=\"text\"\n    label=\"landlord\"\n    suggestions={landlordsQuery.data?.map(p =\u003e p.landlord)}\n  /\u003e\n\n  ...\n}\n```\nData binding is achieved through a `model` property (just like Vue.js does) enabling biderectional state syncing. Gives a much more readable code.\n\u003e `client/src/app/pages/HomePage/index.tsx`\n```tsx\nexport function HomePage() {\n  ...\n  const searchText = useState('');\n  ...\n\n  return (\n  ...\n        \u003cSearchBar model={searchText} /\u003e\n  ...   \n        \u003cSearchInfo appearIf={searchText.state.length \u003e 0}\u003e\n          Results for « {searchText.state} »\n        \u003c/SearchInfo\u003e\n  ...\n}\n```\n\u003e `client/src/app/components/Input.tsx`\n```tsx\ninterface Props extends DefaultProps {\n  model?: ReactiveState\u003cstring\u003e;\n  value?: any;\n}\nexport function Input(this: any, p: Props) {\n  ...\n  const inputValue = useStateIfDefined(model, value || '');\n  ...\n  return (\n        \u003cinput\n          ref={inputRef}\n          type={type}\n          placeholder={placeholder}\n          onChange={e =\u003e inputValue.state = e.target.value}\n          value={inputValue.state}\n        \u003e\u003c/input\u003e\n      )\n}\n```\n\u003e `client/src/app/utils/ReactUtils.ts`\n```tsx\n/**\n * Extension of the value type returned by React.useState().\n */\nexport class ReactiveState\u003cT\u003e extends Array\u003cT | Dispatch\u003cSetStateAction\u003cT\u003e\u003e\u003e {\n  0: T;\n  1: Dispatch\u003cSetStateAction\u003cT\u003e\u003e;\n\n  constructor(getter: T, setter: Dispatch\u003cSetStateAction\u003cT\u003e\u003e) {\n    super();\n    this[0] = getter;\n    this[1] = setter;\n  }\n\n  get state(): T {\n    return this[0];\n  }\n  set state(state: T) {\n    if (this.state === state) return;\n    this[1](state);\n  }\n}\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fakronae%2Fkolivads","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fakronae%2Fkolivads","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fakronae%2Fkolivads/lists"}