Need help understanding

[Mattw112]

I'm used to creating internal SharePoint sites using the out of the box webparts Microsoft has provided.

Recently I was asked to put together a site for one of our teams but, they didn't want it to look like SharePoint.  Wanted it to look more like a real website.

I found a third party tool that I am demoing that basically allows me to create websites on top of SP.  Works great.  But at a cost.

From further research I am seeing a lot about SPF.. but most of it is from the perspective of designing webparts in SPF.  While I don't mind doing a little coding, I am by no means an expert and would rather continue building sites using already developed pieces.

But I'm having a hard time figuring out how to get started.  Like I said if you google getting started with SPF almost everything is about getting started creating spf components... 

Or is that the only way?  I have to build everything?  I saw a getting started package, but wasn't sure if that would give me what I am looking for, don't want a fixed template from Microsoft would like to have something as easy to use as the current webparts in SP but look better and have more capabilities.

Thanks,

Terry

[#2]

components are the pieces used in the react framework that when put together build out your front end webpage. however, they're not necessary. you're able to do a NoJS framework (vanilla javascript, no react) and you can use html/css/javascript. To make everything less from-scratch and more coding-by-editing instead of ground-up, you can use something like bootstrap to get the template of the modernized looking web pages. You just edit parts of it to make it your own.

[#3]

@Mattw112 

Glad that you want to start with SPFx coding ,there is a Fantastic 40 webparts where you can choose to enhance the site look and feel which are already developed

Have a look !! https://github.com/OlivierCC/spfx-40-fantastics

[#4]

@KyleJ90 what does "use something like bootstrap to get the template of the modernized looking web pages" mean.  What is bootstrap?

Thanks,

Terry

[#5]

@O365Developer thanks these look great will install and play with them.

[#6]

So let me ask a basic question.

Let's say I want a basic header that fits the entire screen with no quicklinks on the left.  That is responsive.

How do I do that?

Or if I want to hide all the SharePoint stuff at the top of every page... 

Are those things I could do easily?  Do I need to develop something?

Thanks,

Terry

[#7]

@Mattw112 bootstrap will essentially sell (i think they may have extremely basic free templates, too) the source html/css code. Maybe some basic Javascript functionality (I havent used bootstrap in forever) and you can just literally copy and paste an entire website into your sharepoint web part, and it will look like a modern web page. After copied and pasted, it would be an example website. so it might come with some generic picture background, all you do is change the image src for that piece of code and make it your own, or find the line of code that shows the title, and change that to your own. and that's how you can make the bootstrap template website your own. it saves you the time an effort of building a website from nothing, and allows you to simply make edits. 

to be more clear, if you go to bootstrap, you'll see picture of what different websites can look like. you choose a look, and it tells you what code to copy and paste and it'll run. 

[#8]

@Mattw112 I was told the same thing about "looking like a website." We designed without custom anything using the new communication site option. We made our main intranet page a hub site, and linked departmental pages to it, which creates a unique master menu at the top.  

When you create a communications site, one of the web part options is a full-width image. We generally use that as a header for our various departmental sites. The menu alongside the left is a carry over from previous versions. You can lose that by migrating to the new communications site option (it puts a menu at the top, but you remove the menu). The new SP is very responsive. We have a lot of field staff and it works great on their mobile devices. 

Want to talk about this more? PM me.

-Joni 

 

[#9]

@Joni_Kirk  wow that looks great!  Good job.  I will play with that too.

I will also research the bootstrap stuff more.

Thanks for the idea.

Terry