Hi welcome to this lecture in this lecture I didn't set a project called for a real responsive website.
So let us get started.
OK.
This is the folder for small business page.
This is a project we have been developing in the previous section of TMLC SS jealous of GQ and Brewster
goosestepping one you can take advantage of this sort of structure.
It has for the course Yesus called images and for javascript we already have music playing we're configured
with this code of structure so we can take advantage of this for the structures Lucas you name it with
low skill
Noso this will be the name of our really just wanting conject inside.
So let us sort of move the unnecessary images
in to see a Cisco that we need both posterboard monotonous says because you will be using Ghost a framework
and standards he says and indigenous for that we also need GQ library.
So we already have.
GQ to downloaded and configured with this folder and we already knew goosestepping Dortmunder G is.
So almost everything is configured in this sort of structure.
Let me open this folder and the Vegas editor but before I add this structure to the breakfast or did
we need the content for laso project.
Let us move the content for the project.
This is the content.
Think of it.
This is the content.
The plant has provided to you.
We have the images for the oldest watching Project.
Let me copy it all and move it to the last quarter
okay.
I think we all need images at this point and this will be the content.
We will be using
for our project.
This is just you can think of for the content the client has provided it has some content but we will
be using this content this text for our real.
Object.
OK let us get started.
I mean open this project in the back of city to
open and postop have these who are you working there just soften the Indic start and Steimle find we
have some unnecessary markup there just to move the unnecessary.
I think all of the markup in the board is section.
We need to remove.
So we can start building that unit once you get set from scratch and look me the name the title for
this project it would be so
simple.
Dean and respond see if say this will be the title for this good checked working
let me add some additional thanks.
This is a matter of interest tell the browser to go in court suspicion.
Get back to us.
It is a core group or
data first and I will explain what this meant to take his core
this matter to the viewport element gives the pros an instruction on how to control the page dimension
and Skilling the device bar search the author to follow the screen word of device which will vary depending
on the device and the initial skill sets the initial zoom level.
When the page is first lauded by the browser so it is very important to add.
This made it take for Responsive Web sites okey OK.
One thing let me fix it.
I just know that should is equal equal device Dashni talking no just fine.
Now moving forward.
Let me move these javascript choir's to the body section at the bottom.
Is a good practice to add these scripts at the bottom of Wardy deg because it will increase them page
speed.
Let me add some comments.
More scared.
You tell us it of.
DS
is a good.
OK.
Let's start adding some other resources like Google Forms and for awesome and FEBE icons for this project
you knew who Paypal Google Forms.
And you can easily add dude to the Google for trips site.
So let us start adding the Google phone.
OK this is the vich site of the Google Forms and we can easily add Google Chrome on this website.
The first one we need is that it'll be the support I need.
You just click on disburden Creek use and this these are the all stars for this font.
And BAM little script the style for this
I just add 300.
All of these are called hunger.
Each hundred and let us add this 900.
OK.
I just need to copy this link.
And means to do the header section are also indexed totals.
Jon Karl
are seemed there in a service called the second Google form.
We need this joke which is schools Sasko pre-cruise I would need 400 600 700 and 900.
So on your desktop you the link for this can go and the street here.
Coleman's code is good fonts.
And you would be a good is if we read a book.
Yes.
So the sources
after that and the icon we have I can go I did yes I did buy the plant that does and the fab Eichhorn
link leashing could be.
I can type croupy
image being G.
And actually be images
and gun me.
I can.
So all you have I did over there I can Google Google phones and no we need to add 40000 it mean visit
the court and say OK this is the.
Or awesome.
We need these quote awesome because we will be using these Conte's as I can you know project.
It is a really great resource.
You can see all of they can see soon you'll be using these phones and are the oldest ones that are.
So let us get downloading all downloaded
so it is a daunting no.
Here this is though just once.
This is the zip file I ended up with called Google photos 12:36.
Awesome.
Give me ex-addict deep.
So this extra could fall.
I need the folder.
And form.
Awesome Darkman Garcia says.
These are the good things I need at this stage.
It's been copied of course and through the school project I really need to here.
Derek that's true.
And second I need
to see is this file horn dash.
Awesome I mean it's excuses when if you moved to the CCS color Let us link this foamboard awesome Dortmunder
t Assis NKU them so.
I did hear lnk elation.
Good call.
This will be stencilled also
takes you so he
Kim and
s.c.s and Goncourt awesome.
Making this stunted article.
This is an awesome
game.
So at this point we have headed course I can have a date or something.
And here let us work on staying indoors says a thing we don't need them these days.
So we even start from scratch.
So let me add one more hit and add some staling.
Steady.
This is got all elements marching
G-2 mobs and so you don't play all of the elements on the beach.
It will basically reset all the elements with beddings zero and much in zero and little supply some
rules to the body element.
We just entered Google Forms So let us add the Google folks to say yes.
And we will see it in here.
And if that element is not available then Sensata can still be used.
This is the form we just edit.
You know indexed stories do you mean why should you do this one they'll be so you'll be using these
two forcing the state gace assist for this project.
And let's assume that a workflow while
our long way fiscal is vertical and our film x would be good.
So anything on the horizontal side Michigan or fluvial be hidden.
We'll just add some forceps to the paragraph size.
It should be 14.
We are already using goosestepping.
So visually take responsibility for all of that epigraphy so we don't need to add some more general
CSSA because the stay the course the good said gotcha's.
This will take all of the responsibility.
So this was setting up the project.
So we have all the resources we have.
We have the forms linked to the stay indexed or textual file we have a recon icon and we have added
the port Awesomes.
I think we can start adding it in marker for the header section in the next picture.
See you there.
Thanks.