{"id":579,"date":"2017-01-25T00:00:00","date_gmt":"2017-01-25T08:00:00","guid":{"rendered":"http:\/\/officedevblogs.wpengine.com\/?p=579"},"modified":"2021-11-15T11:00:46","modified_gmt":"2021-11-15T19:00:46","slug":"getting-started-with-sharepoint-framework-tutorials","status":"publish","type":"post","link":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/getting-started-with-sharepoint-framework-tutorials\/","title":{"rendered":"Getting started with SharePoint Framework &#8211; Tutorials"},"content":{"rendered":"<div id=\"body-content\">\n<p><img decoding=\"async\" width=\"800\" height=\"405\" alt=\"\" src=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2018\/05\/dev-office-com-spfx-getting-started.png\"><\/p>\n<h3>Updated getting started tutorials now available<\/h3>\n<p>SharePoint Framework is now in the <a href=\"https:\/\/officedevblogs.wpengine.com\/sharepoint-framework-release-candidate-0-is-on-its-way\">Release Candidate status<\/a>&nbsp;and we are closing in the General Availability (GA). As part of the release activities, we are starting to push out more and more <a href=\"https:\/\/dev.office.com\/sharepoint\/docs\/spfx\/sharepoint-framework-overview\">documentation<\/a>&nbsp;around the SharePoint Framework and how to build your own custom client-side web part using this modern platform. If you have not yet had a change to look into the SharePoint Framework development, we would suggest you to&nbsp;check out the available tutorials. These tutorials will&nbsp;demonstrate and guide you through the steps of setting up your development environment and how to get started with the SharePoint Framework client-side web part development.&nbsp;<\/p>\n<h3>Tutorial list<\/h3>\n<p>Here are the available tutorials around SharePoint Framework. You&#8217;ll find written format of the tutorial and also recorded video,&nbsp;which you can follow to&nbsp;see how to get started with the basic development tasks. You can find link to YouTube recordings from start of the each&nbsp;written tutorial article.&nbsp;<\/p>\n<ul>\n<li><a href=\"https:\/\/dev.office.com\/sharepoint\/docs\/spfx\/web-parts\/get-started\/build-a-hello-world-web-part\">Tutorial 1 &#8211; Build your fist SharePoint client-side web part<\/a>&nbsp;<\/li>\n<li><a href=\"https:\/\/dev.office.com\/sharepoint\/docs\/spfx\/web-parts\/get-started\/connect-to-sharepoint\">Tutorial 2 &#8211; Connect your client-side web part to SharePoint<\/a><\/li>\n<li><a href=\"https:\/\/dev.office.com\/sharepoint\/docs\/spfx\/web-parts\/get-started\/serve-your-web-part-in-a-sharepoint-page\">Tutorial 3 &#8211; Deploy your client-side web part to SharePoint page<\/a><\/li>\n<li><a href=\"https:\/\/dev.office.com\/sharepoint\/docs\/spfx\/web-parts\/get-started\/deploy-web-part-to-cdn\">Tutorial 4 &#8211; Deploy your SharePoint client-side web part to Content Delivery Network (CDN)<\/a><\/li>\n<li><a href=\"https:\/\/dev.office.com\/sharepoint\/docs\/spfx\/web-parts\/get-started\/add-jqueryui-accordion-to-web-part\">Tutorial 5 &#8211; Add jQueryUI Accordion to your SharePoint client-side web part<\/a><\/li>\n<li><a href=\"https:\/\/dev.office.com\/sharepoint\/docs\/spfx\/web-parts\/get-started\/use-fabric-react-components\">Tutorial 6 &#8211; Use Office UI Fabric React Components in your SharePoint client-side web part<\/a>&nbsp;<\/li>\n<\/ul>\n<p>If you have not yet setup your development environment for SharePoint Framework, you can find following guidance for the required steps.<\/p>\n<ul>\n<li><a href=\"https:\/\/dev.office.com\/sharepoint\/docs\/spfx\/set-up-your-development-environment\">Set up your SharePoint client-side web part development environment<\/a>\n<\/li>\n<\/ul>\n<h3>Additional resources around SharePoint Framework<\/h3>\n<p>Here&nbsp;are some additional resources around the SharePoint Framework development topics<\/p>\n<ul>\n<li>Documentation and tutorials &#8211;&nbsp;<a href=\"http:\/\/dev.office.com\/sharepoint\">http:\/\/dev.office.com\/sharepoint<\/a><\/li>\n<li>Samples and code &#8211; <a href=\"http:\/\/github.com\/sharepoint\">http:\/\/github.com\/sharepoint<\/a>&nbsp;or <a href=\"http:\/\/aka.ms\/spfx-samples\">http:\/\/aka.ms\/spfx-samples<\/a>&nbsp;<\/li>\n<li>SharePoint Framework API reference &#8211; <a href=\"http:\/\/aka.ms\/spfx-reference\">http:\/\/aka.ms\/spfx-reference<\/a>&nbsp;<\/li>\n<li>Videos and webcasts &#8211; <a href=\"http:\/\/aka.ms\/sppnp-videos\">http:\/\/aka.ms\/sppnp-videos<\/a>&nbsp;<\/li>\n<li>Announcements and news &#8211; <a href=\"http:\/\/officedevblogs.wpengine.com\">http:\/\/officedevblogs.wpengine.com<\/a>&nbsp;and&nbsp;<a href=\"https:\/\/twitter.com\/officedev\">@OfficeDev<\/a><\/li>\n<li>Suggestions and feedback &#8211; <a href=\"http:\/\/aka.ms\/spfx-feedback\">http:\/\/aka.ms\/spfx-feedback<\/a>&nbsp;and&nbsp;<a href=\"http:\/\/sharepoint.uservoice.com\">SharePoint UserVoice\n<p><\/a><\/li>\n<\/ul>\n<p>If you have any questions, comments or feedback around PnP initiative, these tutorials or this blog post, please use the&nbsp;<a href=\"https:\/\/techcommunity.microsoft.com\/t5\/SharePoint-Developer\/bd-p\/SharePointDev\">Microsoft Tech&nbsp;Community<\/a>&nbsp;(SharePoint Developer group) or the <a href=\"https:\/\/github.com\/SharePoint\/sp-dev-docs\/issues\">issue list<\/a>&nbsp;in the sp-dev-docs repository.<\/p>\n<p><span style=\"font-size: large\"><em>&ldquo;Sharing is caring&rdquo;<\/em><\/span><\/p>\n<hr>\n<p><i><a href=\"https:\/\/twitter.com\/vesajuvonen\">Vesa Juvonen<\/a>, Senior Program Manager, SharePoint, Microsoft &#8211; 25th of January 2017<\/i><\/p>\n<\/p><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Updated getting started tutorials now available SharePoint Framework is now in the Release Candidate status&nbsp;and we are closing in the General Availability (GA). As part of the release activities, we are starting to push out more and more documentation&nbsp;around the SharePoint Framework and how to build your own custom client-side web part using this modern [&hellip;]<\/p>\n","protected":false},"author":69217,"featured_media":580,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[9],"tags":[],"class_list":["post-579","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-sharepoint-framework"],"acf":[],"blog_post_summary":"<p>Updated getting started tutorials now available SharePoint Framework is now in the Release Candidate status&nbsp;and we are closing in the General Availability (GA). As part of the release activities, we are starting to push out more and more documentation&nbsp;around the SharePoint Framework and how to build your own custom client-side web part using this modern [&hellip;]<\/p>\n","_links":{"self":[{"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/posts\/579","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/users\/69217"}],"replies":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/comments?post=579"}],"version-history":[{"count":0,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/posts\/579\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/media\/580"}],"wp:attachment":[{"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/media?parent=579"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/categories?post=579"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/tags?post=579"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}