version and readme update

Author: Manu Chaudhary

DEVELOPING.md

@@ -1,83 +1,41 @@
-# Developing Imagekit Angular SDK
-
-This document describes how to develop Imagekit Angular SDK. 
-
-- [Setting up development environment](#setting-up-development-environment)
-- [Building the project](#building-the-project)
-
-## Setting up development environment
-
-Before you can start developing, you need to install and configure a few dependencies,
-
-- [git](https://git-scm.com/): Github's
-  [Set Up Git](https://help.github.com/articles/set-up-git/) guide is a good
-  source of information.
-- [Node.js 10.x (LTS)](https://nodejs.org/en/download/)
-
-You may want to configure your IDE or editor to get better support for
-TypeScript too.
-
-- [VisualStudio Code](./VSCODE.md)
-
-Before getting started, it is recommended to configure `git` so that it knows
-who you are:
-
-```sh
-git config --global user.name "I am Random"
-git config --global user.email "[email protected]"
-```
-
-Please make sure this local email is also added to your
-[GitHub email list](https://github.com/settings/emails) so that your commits
-will be properly associated with your account and you will be promoted to
-Contributor once your first commit is landed.
-
-## Building the project
-
-The project consists of following major parts
-
-- sdk (contains the SDK code)
-- samples (sample usage and usage example with other angular versions)
-
-### SDK development
+## SDK development
 
 SDK is build in angular 4 for forward compatibilty and `ng-packagr` is used to create final package. Make sure `@angular/cli` is at `v1.4.*` before building the package.
 
-### Building package
+## Building package
 
-Use 
+Execute following command from the `sdk` folder to build the library. This creates a package in `dist/imagekitio-angular` folder.
 ```sh
+# run `npm install` for first time
 npm run build
 ```
-from the `sdk` folder to build the library. This creates a package in `dist/imagekitio-angular` folder.
 
-### Running Tests
+## Running test cases
 
 The designated directory for tests is `sdk/src/sdk-tests` folder. All tests will be executed once on the Chrome Headless browser.
 
-Use 
+Execute following command from the `sdk` folder to start testing.
 ```sh
 npm run test
 ```
-from the `sdk` folder to start testing.
 
-### Running Sample Apps
+## Running sample angular app
 
-Every sample app requires a different version of Angular CLI. Please refer to individual sample app `Readme.md` for details.
-Before sample apps can be used, `imagekitio-angular` library needs to be packed and installed using file system within the sample apps. Use the following steps to run any sample app.
+Every sample app requires a different version of Angular CLI. Please refer to the individual sample app `Readme.md` for details.
+Before sample apps can be used, `imagekitio-angular` library needs to be packed and installed using the file system within the sample apps. Use the following steps to run any sample app.
 
 1. In the `sdk` folder, install dependencies with `npm install`
 2. Build library with `npm run build`
 3. In the `sdk/dist/imagekitio-angular` folder, use `npm pack` to create a tarball with version mentioned in the current package.json for sdk. 
 4. Go to `samples/imagekitio-angular<x>-sample` folder and use `npm install` to install dependencies.
-5. Use `npm install ../../sdk/dist/imagekitio-angular/imagekitio-angular-x.x.x.tgz` where x.x.x needs to be replaced with current version. For example, sdk version is `0.0.1`, then above command becomes `npm install ../../sdk/dist/imagekitio-angular/imagekitio-angular-0.0.1.tgz`
+5. Use `npm install ../../sdk/dist/imagekitio-angular/imagekitio-angular-x.x.x.tgz` where x.x.x needs to be replaced with the current version. For example, SDK version is `0.0.1`, then above command becomes `npm install ../../sdk/dist/imagekitio-angular/imagekitio-angular-0.0.1.tgz`
 6. Configure sample app with required keys. Use each app's `Readme.md` for exact details.
-7. Use npm start from the `samples/imagekitio-angular<x>-sample` folder to run app for particular angular version.
+7. Use npm start from the `samples/imagekitio-angular<x>-sample` folder to run the app for a particular angular version.
 
-### Running Sample Server
+## Running sample backend server
 
 Sample server for upload implementation is available at `samples/sample-server`. To run the server, follow these steps
 
 1. Create a `.env` file based on `sample.env` and enter your private key.
 2. Use `npm install` to install dependencies. 
-3. Use `npm run server` to start the server.
+3. Use `npm run server` to start the server. It will expose the [authentication endpoint](https://docs.imagekit.io/api-reference/upload-file-api/client-side-file-upload#how-to-implement-authenticationendpoint-endpoint) on `http://localhost:3000/auth`

README.md

@@ -1,13 +1,13 @@
-# [WIP] ImageKit.io Angular SDK
+# ImageKit.io Angular SDK
 
 [![Node CI](https://github.com/imagekit-developer/imagekit-angular/workflows/Node%20CI/badge.svg)](https://github.com/imagekit-developer/imagekit-angular/)
 [![npm version](https://img.shields.io/npm/v/imagekitio-angular)](https://www.npmjs.com/package/imagekitio-angular) 
 [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
 [![Twitter Follow](https://img.shields.io/twitter/follow/imagekitio?label=Follow&style=social)](https://twitter.com/ImagekitIo)
 
-Angular SDK for [ImageKit.io](https://imagekit.io) which implements client-side upload and URL generation for use inside an angular application.
+Angular SDK for [ImageKit.io](https://imagekit.io), which implements client-side upload and URL generation for use inside an angular application.
 
-ImageKit is a complete image optimization and transformation solution that comes with an [image CDN](https://imagekit.io/features/imagekit-infrastructure) and media storage. It can be integrated with your existing infrastructure - storages like AWS S3, web servers, your CDN and custom domain names, allowing you to deliver optimized images in minutes with minimal code changes.
+ImageKit is a complete image optimization and transformation solution that comes with an [image CDN](https://imagekit.io/features/imagekit-infrastructure) and media storage. It can be integrated with your existing infrastructure - storages like AWS S3, web servers, your CDN, and custom domain names, allowing you to deliver optimized images in minutes with minimal code changes.
 
 ## Installation
 
@@ -52,7 +52,7 @@ In order to use the SDK, you need to provide it with a few configuration paramet
 `authenticationEndpoint` is essential if you want to use the SDK for client-side uploads.
 `transformationPosition` is optional. The default value for the parameter is `path`. Acceptable values are `path` & `query`
 
-_Note: Do not include your Private Key in any client side code, including this SDK or its initialization. If you pass the `privateKey` parameter while initializing this SDK, it throws an error_
+_Note: Do not include your Private Key in any client-side code, including this SDK or its initialization. If you pass the `privateKey` parameter while initializing this SDK, it throws an error_
 
 ### ik-image
 
@@ -143,7 +143,7 @@ const transformations = [{
 The above image will apply transformation of width = 90 and height = 180 on the image. Since some transformatinos are destructive you might want to control the order in which the transforms are applied.
 
 ##### Chained Transforms
-Chained transforms make it easy to specify the order the transform are applied. example: 
+Chained transformations provide a simple way to control the sequence in which transformations are applied.
 
 ```js
 const transformations = [
@@ -156,7 +156,7 @@ const transformations = [
   }
 ];
 ```
-In the above case, rotation will be performed first and resizing according to width and aspect ratio will be performed afterwards.
+In the above case, the rotation will be performed first, and resizing according to width and aspect ratio will be performed afterward.
 
 #### Low Quality Image Placeholders (LQIP) for images
 The SDK supports automatic support for LQIP for your images, if you set lqip to true in the image component. example:
@@ -168,21 +168,42 @@ The SDK supports automatic support for LQIP for your images, if you set lqip to
 `quality` decided the quaility of placeholder image. It can be any numeric value, a low number means low quality, and high number means high quality.
 
 ##### How does the lqip work?
-The component tries to keep the it simple, it loads a lower quality image using the quality parameter to load a lower quality image, which is then replaced with the actual quality image later.
+The component tries to keep it simple. It loads a lower quality image using the quality parameter to load a lower quality image, which is then replaced with the actual quality image later.
 
 ## File Upload
 #### ik-upload
 The SDK provides a simple Component to upload files to the ImageKit Media Library. It has an attribute called `fileName` which is used by SDK for `fileName` parameter required to upload. The `file` parameter is provided as an input from the user. 
 
-Also make sure that you have specified `authenticationEndpoint` during SDK initialization. The SDK makes an HTTP GET request to this endpoint and expects a JSON response with three fields i.e. `signature`, `token` and `expire`.  
+Also, make sure that you have specified `authenticationEndpoint` during SDK initialization. The SDK makes an HTTP GET request to this endpoint and expects a JSON response with three fields, i.e. `signature`, `token`, and `expire`.  
 
 [Learn how to implement authenticationEndpoint](https://docs.imagekit.io/api-reference/upload-file-api/client-side-file-upload#how-to-implement-authenticationendpoint-endpoint) on your server.
 
 An example of this server is provided in the sample-server folder of the SDK.
 
 Sample Usage
 ```js
+  // Simple upload
   <ik-upload fileName="my-upload" /></ik-upload>
+
+  // Using callbacks and other parameters of upload API
+  <ik-upload fileName="test_new" [useUniqueFileName]="false" [isPrivateFile]="true"
+      (onSuccess)="handleUploadSuccess($event)" (onError)="handleUploadError($event)"></ik-upload>
 ```
 
 `ik-upload` component accepts all the parameters supported by the [ImageKit Upload API](https://docs.imagekit.io/api-reference/upload-file-api/client-side-file-upload#request-structure-multipart-form-data) as attributes e.g. `tags`, `useUniqueFileName`, `folder`, `isPrivateFile`, `customCoordinates` etc.
+
+## Sample application
+The `samples` folder contains a fully working sample angular application for angular versions 4, 5, 6, 7, and 8. Every application has a README.md file with full instructions on how to run it locally.
+
+## Support
+
+For any feedback or to report any issues or general implementation support, please reach out to [[email protected]](mailto:[email protected])
+
+## Links
+
+-   [Documentation](https://docs.imagekit.io)
+-   [Main website](https://imagekit.io)
+
+## License
+
+Released under the MIT license.

samples/imagekitio-angular4-sample/README.md

@@ -10,7 +10,7 @@ This project shows the usage of ImageKit Angular SDK in an Angular 4 app. Please
   @angular/cli: 1.4.10
 ```
 
-## Runnning the application
+## Running the application
 
 Before you can use Imagekit SDK, you need to provide config values required in `app.module.ts` and `app.component.ts`. You can either configure your environment and take values from there, or directly provide in respective files.
 

samples/imagekitio-angular4-sample/src/app/app.module.ts

@@ -11,7 +11,7 @@ import { ImagekitioAngularModule } from "imagekitio-angular";
     ImagekitioAngularModule.forRoot({
       urlEndpoint: "<YOUR_URL_ENDPOINT>",
       publicKey: "<YOUR_PUBLIC_KEY>",
-      authenticationEndpoint: "<YOUR_AUTH_ENDPOINT>"
+      authenticationEndpoint: "<YOUR_AUTH_ENDPOINT e.g http://localhost:3000/auth>"
     })
   ],
   providers: [],

samples/imagekitio-angular5-sample/README.md

@@ -1,6 +1,6 @@
 # Imagekit Angular 5 Sample
 
-This project shows the usage of ImageKit Angular SDK in an Angular 4 app. Please note that you need to have `@angular/cli v1.6.*` installed to run this application. If you are on latest version, you can uninstall current version and install required one like this: 
+This project shows the usage of ImageKit Angular SDK in an Angular 5 app. Please note that you need to have `@angular/cli v1.6.*` installed to run this application. If you are on latest version, you can uninstall current version and install required one like this: 
 
 
 ```sh
@@ -10,7 +10,7 @@ This project shows the usage of ImageKit Angular SDK in an Angular 4 app. Please
   @angular/cli: 1.6.6
 ```
 
-## Runnning the application
+## Running the application
 
 Before you can use Imagekit SDK, you need to provide config values required in `app.module.ts` and `app.component.ts`. You can either configure your environment and take values from there, or directly provide in respective files.
 

samples/imagekitio-angular5-sample/src/app/app.module.ts

@@ -14,7 +14,7 @@ import { ImagekitioAngularModule } from "imagekitio-angular";
     ImagekitioAngularModule.forRoot({
       urlEndpoint: "<YOUR_URL_ENDPOINT>",
       publicKey: "<YOUR_PUBLIC_KEY>",
-      authenticationEndpoint: "<YOUR_AUTH_ENDPOINT>"
+      authenticationEndpoint: "<YOUR_AUTH_ENDPOINT e.g http://localhost:3000/auth>"
     })
   ],
   providers: [],

samples/imagekitio-angular6-sample/README.md

@@ -1,6 +1,6 @@
 # Imagekit Angular 6 Sample
 
-This project shows the usage of ImageKit Angular SDK in an Angular 4 app. Please note that you need to have `@angular/cli v6.1.*` installed to run this application. If you are on latest version, you can uninstall current version and install required one like this: 
+This project shows the usage of ImageKit Angular SDK in an Angular 6 app. Please note that you need to have `@angular/cli v6.1.*` installed to run this application. If you are on latest version, you can uninstall current version and install required one like this: 
 
 
 ```sh
@@ -10,7 +10,7 @@ This project shows the usage of ImageKit Angular SDK in an Angular 4 app. Please
   @angular/cli: 6.1.1
 ```
 
-## Runnning the application
+## Running the application
 
 Before you can use Imagekit SDK, you need to provide config values required in `app.module.ts` and `app.component.ts`. You can either configure your environment and take values from there, or directly provide in respective files.
 

samples/imagekitio-angular6-sample/src/app/app.module.ts

@@ -11,9 +11,9 @@ import { ImagekitioAngularModule } from "imagekitio-angular";
   imports: [
     BrowserModule,
     ImagekitioAngularModule.forRoot({
-      urlEndpoint: "",
-      publicKey: "",
-      authenticationEndpoint: ""
+      urlEndpoint: "<YOUR_URL_ENDPOINT>",
+      publicKey: "<YOUR_PUBLIC_KEY>",
+      authenticationEndpoint: "<YOUR_AUTH_ENDPOINT e.g http://localhost:3000/auth>"
     })
   ],
   providers: [],

samples/imagekitio-angular7-sample/README.md

@@ -1,6 +1,6 @@
-# Imagekit Angular 6 Sample
+# Imagekit Angular 7 Sample
 
-This project shows the usage of ImageKit Angular SDK in an Angular 4 app. Please note that you need to have `@angular/cli v7.*.*` installed to run this application. If you are on latest version, you can uninstall current version and install required one like this: 
+This project shows the usage of ImageKit Angular SDK in an Angular 7 app. Please note that you need to have `@angular/cli v7.*.*` installed to run this application. If you are on latest version, you can uninstall current version and install required one like this: 
 
 
 ```sh
@@ -10,7 +10,7 @@ This project shows the usage of ImageKit Angular SDK in an Angular 4 app. Please
   @angular/cli: 7.3.8
 ```
 
-## Runnning the application
+## Running the application
 
 Before you can use Imagekit SDK, you need to provide config values required in `app.module.ts` and `app.component.ts`. You can either configure your environment and take values from there, or directly provide in respective files.
 

samples/imagekitio-angular7-sample/src/app/app.module.ts

@@ -12,9 +12,9 @@ import { ImagekitioAngularModule } from "imagekitio-angular";
     BrowserModule,
     AppRoutingModule,
     ImagekitioAngularModule.forRoot({
-      urlEndpoint: "",
-      publicKey: "",
-      authenticationEndpoint: ""
+      urlEndpoint: "<YOUR_URL_ENDPOINT>",
+      publicKey: "<YOUR_PUBLIC_KEY>",
+      authenticationEndpoint: "<YOUR_AUTH_ENDPOINT e.g http://localhost:3000/auth>"
     })
   ],
   providers: [],