Updating many READMEs and adding Svelte and Angular starter apps

README.md

@@ -21,7 +21,7 @@ Collection of starter/sample/demo apps that aims to help you getting started wit
 
 * **Language**: JavaScript (\*.js) or Typescript (\*.ts)
 * **Environment**: client-side (browser) vs server-side (Node.js)
-* **Framework**: None (Vanilla JS) or any framework (Vue, React, Angular, Ember, Ionic, React Native, Flutter, ...)
+* **Framework**: None (Vanilla JS) or any framework (Vue, React, Angular, Svelte, Ember, Ionic, React Native, Flutter, Electron, ...)
 * **Loading from**: CDN or Local (@arcgis/core)
 * **Loading strategy**: AMD (require) or ESM (import)
 * **Web bundler**: Without using a bundler or using one (ViteJS, Rollup.js, Webpack, Parcel, Snowpack, ...)
@@ -59,6 +59,12 @@ Collection of starter/sample/demo apps that aims to help you getting started wit
 
 **API reference**: [ArcGIS for JavaScript API reference](https://developers.arcgis.com/javascript/latest/api-reference/)
 
+### Learning paths
+
+We are still working on selecting a curated list of resources you help you better understand which are the most important lessons to get your goal.
+
+But if you need advise do not hesitate, [open an issue](https://github.com/hhkaos/arcgis-js-api-starter-apps/issues).
+
 ## Other resources
 
 * [arcgis-js-vscode-snippets](https://github.com/Esri/arcgis-js-vscode-snippets): Collection of Visual Studio Code snippets for common code patterns.

docs/1.how-to-run-js.md

@@ -12,6 +12,8 @@
 - [Type definitions](#type-definitions)
 - [Run 3rd party JS libraries with TypeScript](#run-3rd-party-js-libraries-with-typescript)
   - [Run ArcGIS API using TypeScript without any frameworks](#run-arcgis-api-using-typescript-without-any-frameworks)
+  - [Run ArcGIS API using ESM + Angular (TS)](#run-arcgis-api-using-esm--angular-ts)
+- [Documentation about TypeScript in the ArcGIS API for JavaScript](#documentation-about-typescript-in-the-arcgis-api-for-javascript)
 
 <!-- END doctoc generated TOC please keep comment here to allow auto update -->
 
@@ -118,4 +120,12 @@ We provide three starter-apps:
 
 * Using AMD (without any web bundler): [ts-amd-cdn-nobundler-noframework](../starter-apps/ts-amd-cdn-nobundler-noframework/) 
 * Using ESM and Rollup.js bundler: [ts-esm-local-rollup-noframework](../starter-apps/ts-esm-local-rollup-noframework/).
-* Using ESM and Webpack bundler: [ts-esm-local-webpack-noframework](../starter-apps/ts-esm-local-webpack-noframework/).
+* Using ESM and Webpack bundler: [ts-esm-local-webpack-noframework](../starter-apps/ts-esm-local-webpack-noframework/).
+
+### Run ArcGIS API using ESM + Angular (TS)
+
+[Check ts-esm-local-nobundler-angular](../starter-apps/ts-esm-local-nobundler-angular).
+
+## Documentation about TypeScript in the ArcGIS API for JavaScript 
+
+[TypeScript - Setting up your development environment](https://developers.arcgis.com/javascript/latest/typescript-setup/)

docs/README.md

@@ -1,5 +1,7 @@
 # Getting started with TypeScript and ArcGIS JS API
 
+Don't be scared, you can start small with TypeScript because can adopt it syntax gradually as you can do when migrating from ES5 to ES6, this means you can keep coding the same way you used to do and start adding/trying TypeScript syntax/capabilities little by little.
+
 These docs aims to help you getting started with TypeScript to be able to use it in combination with the ArcGIS JS API:
 
 0. [TypeScript grammar](./0.ts-grammar.md)

starter-apps/README.md

@@ -1,26 +1,73 @@
 # ArcGIS API for JavaScript 4.x starter apps
 
+The goal of these starter apps is to **provide the best developer experience** possible for developers learning the [ArcGIS API for JavaScript](http://js.arcgis.com/) 
+
 |Language|Framework|From|Strategy|Bundler|Code|
 |---|---|---|---|---|---|
 |JavaScript|None|CDN|AMD|None|[Code](./js-amd-cdn-nobundler-noframework)
+|JavaScript|Svelte|CDN|AMD|Rollup.js|[Code](./js-amd-cdn-rollup-svelte)
 |JavaScript|None|CDN|ESM|None|[Code](./js-esm-cdn-nobundler-noframework)
 |JavaScript|Ember.js|Local|ESM|None|[Code](./js-esm-local-nobundler-ember)
 |JavaScript|React|Local|ESM|None|[Code](./js-esm-local-nobundler-react)
 |JavaScript|Vue.js|Local|ESM|None|[Code](./js-esm-local-nobundler-vue)
 |JavaScript|None|Local|ESM|Rollup.js|[Code](./js-esm-local-rollup-noframework)
 |JS / NodeJS|None|Local|ESM|Rollup.js|[Code](./js-esm-local-rollup-nodejs)
 |JavaScript|None|Local|ESM|Snowpack|[Code](./js-esm-local-snowpack-noframework)
-|JavaScript|None|Local|ESM|Vite|[Code](./js-esm-local-vite-noframework/README.md)
-|JavaScript|None|Local|ESM|Webpack|[Code](./js-esm-local-webpack-noframework/README.md)
-|JavaScript|None|Local|ESM|Webpack|[Code (alt)](./js-esm-local-webpack-noframework-2/README.md)
-|TypeScript|None|CDN|AMD<sup>1</sup>|None|[Code](./ts-amd-cdn-nobundler-noframework/README.md)
+|JavaScript|None|Local|ESM|Vite|[Code](./js-esm-local-vite-noframework)
+|JavaScript|None|Local|ESM|Webpack|[Code](./js-esm-local-webpack-noframework)
+|JavaScript|None|Local|ESM|Webpack|[Code (alt)](./js-esm-local-webpack-noframework-2)
+|TypeScript|None|CDN|AMD<sup>1</sup>|None|[Code](./ts-amd-cdn-nobundler-noframework)
+|TypeScript|Angular|Local|ESM|None|[Code](./ts-esm-local-nobundler-angular)
 |TypeScript|None|Local|ESM|Rollup.js|[Code](./ts-esm-local-rollup-noframework)
 |TypeScript|None|Local|ESM|Webpack|[Code](./ts-esm-local-webpack-noframework)
 
+Recomemded talks: 
+
+* [ArcGIS API for JavaScript: Options for Consuming the API](https://www.youtube.com/watch?v=UL0m0EXW8Es)
+* [ArcGIS API for JavaScript: Building Apps with ES Modules](https://www.youtube.com/watch?v=ojrGonjJI2k)
+
+## Code autocompletion 
+
+You can speed up your developement using code autocompletion in any application that uses local ESM modules (with plain JS) or TypeScript within [Visual Studio Code](https://code.visualstudio.com/download) because both includes **[@types/arcgis-js-api](https://www.npmjs.com/package/@types/arcgis-js-api)** and the IDE identifies it an extend the autocompletion.
+
+With type definitions you will get
+
+1) Autocompletion of supported properties and methods of each class:<br>
+![Autocomplete properties example](../docs/assets/autocomplete-properties-2.png)
+
+2) Documentation about supported parameters, links to the API Reference, etc.:<br>
+![ArcGIS type definitons example](../docs/assets/arcgis-typings.png)
+
+# Code snippets
+
+You can speed up your developement using code using **[ArcGIS API for JavaScript Snippets for Visual Studio Code](https://marketplace.visualstudio.com/items?itemName=Esri.arcgis-jsapi-snippets)**. It includes **code snippets** to:
+
+1) Help you instantiate classes like `Webmap`:<br>
+![Code snippets](../docs/assets/webmap-code-snippet.png)
+
+2) Providing you with all accepted values in a property like `map.basemap`:<br>
+![basemap-style-autocomplete-1](../docs/assets/basemap-style-autocomplete-1.png)<br><img alt="basemap-style-autocomplete-2" src="../docs/assets/basemap-style-autocomplete-2.png" width="400">
+
+3) But you can also **[add your own code snippets](https://github.com/Esri/arcgis-js-vscode-snippets/blob/master/contributing.md#contributing-guidelines)**
+
+You can find additional snippets in [https://github.com/hhkaos/esri-vscode-snippets](https://github.com/hhkaos/esri-vscode-snippets) and a [snippets builder tool](https://hhkaos.github.io/vscode-snippets-builder/) to add your custom ones.
+
+You can also migrate those [snippets to Sublime Text and Atom with this tool](https://snippet-generator.app/?description=&tabtrigger=&snippet=&mode=sublimetext).
+
+## Contributions
+
+New starter apps and improvements to existing starter apps (simplifications, instructions, bug fixing, updates, ...) are welcome. So please feel free to submit yours.
+
 If you don't find a starter app that fits your needs, do not hesitate and [open an issue](https://github.com/hhkaos/arcgis-js-api-starter-apps/issues).
 
 > **Note <sup>1</sup>**: you will use `import` statements (ESM) with the AMD path, and the TypeScript compiler will translate them to AMD.
 
+## Starter apps maintenance and support
+
+This starter apps are maintained by the community. If you find something broken or outdated and **the code from the starter app comes from another repository please open the issue there**, if it doesn't feel free to [open an issue on this repo](https://github.com/hhkaos/arcgis-js-api-starter-apps/issues).
+
+Note that frameworks and bundlers are outside of the [scope of support](https://support.esri.com/en/supportscope) from the Esri Technical Support. In any case, you can use the issues repositories related to each starter app to interact with the community for support.
+
 ## Acknowledgments
 
 Bellow you will find some of the resources used to compile this samples apps:
@@ -30,4 +77,4 @@ Bellow you will find some of the resources used to compile this samples apps:
 * [https://github.com/Esri/jsapi-resources/tree/master/4.x/typescript/demo](https://github.com/Esri/jsapi-resources/tree/master/4.x/typescript/demo): ts-amd-cdn-nobundler-noframework
 * [http://js.arcgis.com/](http://js.arcgis.com/): js-amd-cdn-nobundler-noframework
 * [Quick look at custom builds with ArcGIS JSAPI](https://www.youtube.com/watch?v=VmzjaGfBRyo): js-esm-local-vite-noframework, js-esm-local-webpack-noframework
-* [https://github.com/odoe/snowpack-jsapi](https://github.com/odoe/snowpack-jsapi): js-esm-local-snowpack-noframework
+* [https://github.com/odoe/snowpack-jsapi](https://github.com/odoe/snowpack-jsapi): js-esm-local-snowpack-noframework

starter-apps/js-amd-cdn-nobundler-noframework/README.md

@@ -1 +1,19 @@
-> **Note**: original code from [https://developers.arcgis.com/javascript/latest/sample-code/intro-mapview/](https://developers.arcgis.com/javascript/latest/sample-code/intro-mapview/)
+# js-amd-cdn-nobundler-noframework
+
+|Language|Framework|From|Strategy|Bundler|
+|---|---|---|---|---|
+|JavaScript|None|CDN|AMD|None|
+
+Recomemded resources:
+
+* [ArcGIS API for JavaScript: Getting Started with Web Development](https://www.youtube.com/watch?v=z9kIZjUjsZ4&list=PLahIW2YFPQd6Uu9u3kRTgGo-HxONKDTi1&index=28)
+
+## Acknowledgments
+
+The original code from [https://developers.arcgis.com/javascript/latest/sample-code/intro-mapview/](https://developers.arcgis.com/javascript/latest/sample-code/intro-mapview/).
+
+## Starter apps maintenance and support
+
+This starter apps are maintained by the community. If you find something broken or outdated and **the code from the starter app comes from another repository please open the issue there**, if it doesn't feel free to [open an issue on this repo](https://github.com/hhkaos/arcgis-js-api-starter-apps/issues).
+
+Note that frameworks and bundlers are outside of the [scope of support](https://support.esri.com/en/supportscope) from the Esri Technical Support. In any case, you can use the issues repositories related to each starter app to interact with the community for support.

starter-apps/js-amd-cdn-rollup-svelte/.github/workflows/main.yml

@@ -0,0 +1,26 @@
+name: Build and Deploy
+on:
+  push:
+    branches:
+      - master
+jobs:
+  build-and-deploy:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout 🛎️
+        uses: actions/[email protected] # If you're using actions/checkout@v2 you must set persist-credentials to false in most cases for the deployment to work correctly.
+        with:
+          persist-credentials: false
+
+      - name: Install and Build 🔧
+        run: |
+          npm install
+          npm run build
+
+      - name: Deploy 🚀
+        uses: JamesIves/[email protected]
+        with:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          BRANCH: gh-pages # The branch the action should deploy to.
+          FOLDER: public # The folder the action should deploy.
+          CLEAN: true # Automatically remove deleted files from the deploy branch

starter-apps/js-amd-cdn-rollup-svelte/.gitignore

@@ -0,0 +1,4 @@
+/node_modules/
+/public/build/
+
+.DS_Store