syedpeer / spfx-announcements

This is a github repository for my blog post http://www.qipoint.com/blog/create-your-first-client-side-web-part-using-sharepoint-framework-spfx-part-1/

Creating Annoucnement Webpart using SharePoint Framework

spfx-announcement

This is announcement webpart created using the SharePoint Framework and typescript. This webpart has been created as a part of the following blog post series.

Article	Link
Getting Started with SharePoint Framework (SPFx)	http://www.qipoint.com/blog/getting-started-with-sharepoint-framework-spfx/
Setting up Developer Environment for SharePoint Framework (SPFx)	http://www.qipoint.com/blog/setting-up-developer-environment-for-sharepoint-framework-spfx/
SharePoint Framework (SPFx) (Part 1) Create a simple Client Side Web Part	http://www.qipoint.com/blog/create-your-first-client-side-web-part-using-sharepoint-framework-spfx-part-1/
SharePoint Framework (SPFx) (Part 2) Create a Simple Client-side Web Part	http://www.qipoint.com/blog/create-your-first-client-side-web-part-using-sharepoint-framework-spfx-part-2/
SharePoint Framework (SPFx) (Part 3) Deploying and Shipping Your Client-side Web Part with Office 365 CDN	http://www.qipoint.com/blog/sharepoint-framework-spfx-part-3-deploying-and-shipping-your-client-side-web-part-with-office-365-cdn/

Screenshot

Applies to

• SharePoint Framework
• Office 365 developer tenant

Solution

Solution	Author(s)
spfx-ANNOUNCEMENT	Dhaval Shah (SharePoint & .Net Consultant)

Disclaimer

THIS CODE IS PROVIDED AS IS WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING ANY IMPLIED WARRANTIES OF FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABILITY, OR NON-INFRINGEMENT.

---

Building the code

To build and run this client-side project, you will need to clone and build the tutorials project.

Clone this repo by executing the following command in your console:

git clone https://github.com/dhavalshah01/spfx-announcements.git

Navigate to the cloned repo folder which should be the same as the repo name:

cd spfx-announcements

Now run the following command to install the npm packages:

npm install

This will install the required npm packages and depedencies to build and run the client-side project.

Once the npm packages are installed, run the command to preview your web parts in SharePoint Workbench:

gulp serve

This package produces the following:

* lib/* - intermediate-stage commonjs build artifacts
* dist/* - the bundled script, along with other resources
* deploy/* - all resources which should be uploaded to a CDN.

### Build options

gulp build
gulp serve