{"id":15141930,"url":"https://github.com/especializa/nativescript-whatsapp-template","last_synced_at":"2025-10-23T19:31:00.476Z","repository":{"id":57308842,"uuid":"106759621","full_name":"Especializa/nativescript-whatsapp-template","owner":"Especializa","description":"NativeScript Template Similar to WhatsApp","archived":false,"fork":false,"pushed_at":"2018-05-07T22:41:15.000Z","size":3545,"stargazers_count":62,"open_issues_count":4,"forks_count":29,"subscribers_count":8,"default_branch":"master","last_synced_at":"2024-10-09T22:40:18.989Z","etag":null,"topics":["android","angular","angular2","angular4","ios","javascript","nativescript","nativescript-template","template","typescript","whatsapp"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Especializa.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":"2017-10-13T00:39:38.000Z","updated_at":"2024-09-26T15:03:37.000Z","dependencies_parsed_at":"2022-09-01T06:31:48.460Z","dependency_job_id":null,"html_url":"https://github.com/Especializa/nativescript-whatsapp-template","commit_stats":null,"previous_names":[],"tags_count":2,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Especializa%2Fnativescript-whatsapp-template","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Especializa%2Fnativescript-whatsapp-template/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Especializa%2Fnativescript-whatsapp-template/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Especializa%2Fnativescript-whatsapp-template/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Especializa","download_url":"https://codeload.github.com/Especializa/nativescript-whatsapp-template/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":219867955,"owners_count":16555810,"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":["android","angular","angular2","angular4","ios","javascript","nativescript","nativescript-template","template","typescript","whatsapp"],"created_at":"2024-09-26T09:20:37.753Z","updated_at":"2025-10-23T19:30:55.029Z","avatar_url":"https://github.com/Especializa.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# NativeScript WhatsApp Template ![apple](https://cdn3.iconfinder.com/data/icons/picons-social/57/16-apple-32.png) ![android](https://cdn3.iconfinder.com/data/icons/logos-3/228/android-32.png)\n\n[![NPM version][npm-image]][npm-url]\n[![Downloads][downloads-image]][npm-url]\n[![Dependencies][dependencies-image]][npm-url]\n[![DevDependencies][dev-dependencies-image]][npm-url]\n[![Twitter Follow][twitter-image]][twitter-url]\n\n[npm-image]:http://img.shields.io/npm/v/nativescript-whatsapp-template.svg\n[npm-url]:https://npmjs.org/package/nativescript-whatsapp-template\n[downloads-image]:http://img.shields.io/npm/dt/nativescript-whatsapp-template.svg\n[dependencies-image]:https://david-dm.org/Especializa/nativescript-whatsapp-template/status.svg\n[dev-dependencies-image]:https://david-dm.org/Especializa/nativescript-whatsapp-template/dev-status.svg\n[twitter-image]:https://img.shields.io/twitter/follow/especializa.svg?style=social\u0026label=Follow%20us\n[twitter-url]:https://twitter.com/especializa\n\n## Installation\nFrom the command prompt, start a new Nativescript project doing:\n```sh\ntns create your-project-name --template nativescript-whatsapp-template\n```\n## Introduction\n[![N|Solid](https://udemy-images.udemy.com/course/750x422/1011174_0030_5.jpg)](https://www.udemy.com/angular-native)\n\nThis project is heavily based on [this repo](https://github.com/Especializa/nativesapp), created as part of the course:\n- [Aprenda Angular 2 + Nativescript e crie um WhatsApp](https://www.udemy.com/angular-native)\n**[CLICK HERE FOR ~90% OFF COUPON](https://www.udemy.com/angular-native/?couponCode=LANCAMENTO)**\n\nAt the moment, only available in Portuguese, but English version is coming soon.\nReach out to us on Twitter [![Twitter Follow][twitter-image]][twitter-url] if you want to push us to get it done sooner :)\n\n### First run\nRight after creating a project and then npm install, it should be ready to go. Just move into your project's folder and execute the normal `tns` command to run any app:\n```sh\ncd your-project-name\nnpm i\ntns run\n```\nAlternatively you can target any specifc platform:\n```sh\ntns run android\n```\n```sh\ntns run ios\n```\nThat's pretty much what you should expect to see for the initial screen:\n#### - Screenshot 1: Chats tab (iOS / Android)\n[![N|Solid](https://raw.githubusercontent.com/Especializa/nativesapp/master/app/tools/assets/screenshot-1.png)](https://www.udemy.com/angular-native)\n\nAnd that's the chat screen upon clicking on any chat item in the previous screen:\n#### - Screenshot 2: Chat screen (iOS / Android)\n[![N|Solid](https://raw.githubusercontent.com/Especializa/nativesapp/master/app/tools/assets/screenshot-2.png)](https://www.udemy.com/angular-native)\n### Removing initial data\nYou might want to remove all the dummy data as well as some boilerplate code. The content shown relies upon the service `core/chats.services.ts` inside your `app` folder. Just replace the content returned there with what you need.\n#### Emptying chats.services.ts\n```javascript\nimport { Injectable } from '@angular/core';\n\nimport { Chat } from './models/chat.model';\nimport { Message } from './models/message.model';\n\n@Injectable()\nexport class ChatsService {\n  get chats(): Chat[] {\n    return [];\n  }\n  getMessages(chat: Chat): Message[] {\n    return [];\n  }\n}\n```\nAnother advisable tweak is removing the line which slices the list of messages in the selected chat to get only a chunck of initial 50 ones. The reason for that is just to illustrate that not all messages should appear on landing on that screen, but we wouldn't like to sound too opinionated at this point telling you how to fetch and show your own data.\n#### Replace the slice command on messages-area.component.ts\n```diff\nexport class MessagesAreaComponent implements OnInit {\n  // ...\n  ngOnInit() {\n-    this.messages = this.messages.slice(0, 50);\n+    // your own code\n  }\n  // ...\n}\n```\n\n## Changelog\n- 1.0.0  Initial implementation\n\n## License\nApache License Version 2.0, January 2004\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fespecializa%2Fnativescript-whatsapp-template","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fespecializa%2Fnativescript-whatsapp-template","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fespecializa%2Fnativescript-whatsapp-template/lists"}