fetch

Build Twitter with REST API and JSON (Search and Fetch New Tweets from Twitter)



Sharing buttons:

- is Duke in this training would love to

share with you how to build the Twitter

app yeah the Twitter app that you

connect your app directly into Twitter

and you can search for new tweet you can

search for a single user or you can

search for any hashtags that you have so

here is how the app will looks like on

the simulator so we have a tweet the

newsfeed looks exactly like Twitter

beautiful and we can search for new

treats so for example if I search for

interior design like this the research

for interior design we have a bunch of

new treats coming out and you can scroll

down you see some poses beautiful images

some post doesn't have ones that is how

the app will looks like after we finish

this training now you're going to learn

a lot about how to deal with UI our UI

and kill you you're going to deal with I

was networking about rice API like Jason

about third-party libraries all of those

stuff we'll talk about in this training

and were designed beautiful UI for the

Twitter client the Twitter app so the

first step what we love to do right now

is goes into the description and

download your starter project so I

prepared for you the star project with

all the resources on the libraries on

the frameworks and some UI elements

things like icons images so all you have

to do is click the link on this page

right in the description that you go

into my website over here and cling to

the page you just have to leave your

name and email that so I can send you

directly to your email the star project

and the complete project all the

resources the icons the images on the

frameworks and the libraries and then I

would love to give you one extra thing

and that is I have a new training coming

up and that is what we call how to build

Nike ecommerce retail store without

losing $50,000 if you know the Nike

ecommerce is one of the

most popular e-commerce app and it's

just like Amazon or Facebook marketplace

something that you can post some new

products in and sell it online so that

is what we talked about in that training

usually it took people of you dozen

thousands of dollars to build that I'm

going to share with you how to build

that without virtually no cost at all

all you have to do is go into

description leave your name email there

and I will send you all of those

trainings so let's go ahead download

that now

or I refrained open up your star project

here we go now the way that you can

download this star project is all you do

is click the link right below this page

that will link for you something like

this and you see goes to a page like

that initiative app that we're going to

build together and we have the download

for your Twitter training and then just

click here put in your first name and

your email and I'm happy to send that

for you all of three there's nothing

here it's just that I need your email so

I can send you that and also there is a

special how to build naggy ecommerce

start training I'm going to give you so

I'm stoked about it so just go ahead

download the start project in let's get

started

here we go and let me change the font

size a little bit so we can have it so

let's open the start project now the way

that you do that is not open up your

Twitter

Tweety's the Xcode project like this but

open the EXCI workspace let me explain

why it is the case that you have to open

the actually workspace here we go

so inside here you will see that inside

there will be a frameworks folder and it

says Twitter dot framework what it all

means is that it has some code that

we're already write for you so that you

can use that in your project and you see

this is the Twitter folder over here and

you click into that there will be

another Xcode project inside here and if

I open up this Xcode project like this

and you will find down then there is

just a bunch of code in here we'll see

that all right now I you don't really

need to explore this stuff I will

explain to you as we use some of these

things it's just some of the classes

some of the helper methods that an

instructor from a cast very famous

conscious or not 193 P from Stanford

University you wrote this course on his

steering's can use to create Twitter

apps so I'm going to use that huge

thanks to him here we go let's open up

Xcode and then

to the main the storyboard and we will

design our Twitter app over here and by

the way this is how the app looks like

me open up an example of the app

actually over here right see this so we

have the search bar and then a bunch of

selves now if you look at the South I

know it is a give so we'll change it to

the cells are here maybe this is the

Twitter I am over here we have the

thumbnail of our client of the user and

then we have the username of the user

and then the handle and the minutes that

these are posted and then the body types

and then image if the post has some

image as a button though here so let's

create this stuff here we go I'm going

to remain the storyboard and because

this is a TV controller right when you

notice that it also has the navigation

bar below here that means that we need a

tab bar controller so lets me drag out a

tab bar controller to the screen like

this and then also don't forget that we

need to make this tab our controller to

be our initial view controller and then

let's delete these two view controller

that we don't need here right then

because we have four tabs so just in

case we need those over five so that's

Jack our five navigation controller here

because this navigation controller also

have the table view controller let me

make some space so we have navigation

controller and the table view controller

right here

that's one all right so this is one you

put that up here like some room and then

I'm going to duplicate this guy that's

two let's have here duplicate that guy

that's three come on

so that's for eyewear for now and the

last one let's have the last one here

and that's five I know there's kind of

manual but that's the way that we do it

so next thing is we'll connect all of

these view controllers these navigation

controller to the tab bar controller so

I'm going to right click and drag it to

the navigation controller like this

thing a the relationship segue is view

controllers so that this thing has a

view controller segue to our tab bar

controller and let's do the same thing

for this guy this guy this guy

and finally this guy like this alright

pretty cool

okay now let's mizzu mean like this and

then we'll change the icons for our app

so the way that you do it is just click

over here click each of the icon like

this so you look at the complete app

over here let me open it like this so

you have the home the moments

notifications messages and the me so

let's open that up okay let me do it

like this maybe easier for you to see

right so the home let's click over here

we have the image is I really believe

that is icon home oh I can't analyze

like that and then we have the title is

oh I guess right oh it's not home good

next let's have this guy the icon

moments this is moments and below here

we have this guy it is notification so

icon notification the title is

notifications next messages in profile

so here messages icon messages and last

oh here I can't me and me I don't know

why they named it that way but it's just

a white egg work now let's run the

project and see how it looks like from

our initial view controllers like that

oh it's built failed what is this over

here now in that case you see that it

says like something I just miss that

error message but what it says is that

the Twitter the framework here Xcode

cannot find it so all you have to do now

is go over your project like this open

up the Twitter folder and then you see

the tweet actually works Xcode touch why

so all you have to do is drag this thing

out ooh you're purging there we go

but notice that don't drag it inside the

Tweenies target drag it outside of it

like this and here we go and see that

it's outside and then we put it right

there so we have two things like this

cool so now lets me run the project in

so it looks like here we go

let's build succeeded that's cool and

then we have this thing pretty nice huh

all right so that's a good start that's

a good sign

here we go the next step let's move on

to next steps is we will design our home

screen the new street the timelines is

what Twitter says and we'll focus the

main training on this guy so let's go

ahead into the main Oh storyboard and

we'll call it the project and then it is

put over here we have this guy over

there so now the first step you see is

the image over here the newsfeed has the

search bar but the search bar what you

can do is you can really drag our search

bars from adding up the object palettes

like this into the screen but what we'll

actually do is I will programmatically

program the search bar on top of our

view controller in chosen moment after

we implement everything it will

implement the search bar in our

then let's do our newsfeed over here

each of the cells for the tableview

seven the one we need we need this to be

bigger by the sound needs to be bigger

so let's drag out the cells down like

this now because I already design my

project when I make this app so I'm

going to make sure that all the size

fits so that we set us some time the

table view cell roll height I want to

put that as 333 points like this and

then let's check out the project the

profile image of the user so we have the

profile image over here something like

this so let's check that out the image

view

let's drag an image view like this and

then we'll make sure that this image

view it is a to the top and a to the

left the width and height is 48 so X is

8 y is 8 which is 48 and height is 48

like this next thing let's have our

learn the content mode of this image to

be a speck fill cool then let's try out

a label we'll need a label for our

Twitter full name over here and let me

do put atom click and have this guy

Twitter full name awesome now let's

change the font of this Twitter full

name because we know that it could be

kind of like bold and a little bit

bigger than it should be right over here

so on this to the full name over there

let's click over here now the system it

is using the system font and I actually

don't want to use the system font I want

to use the text styles over here

now this text Styles this is actually

the system font but it would changes the

font size and the boldness and all those

things according to what the user sent

in the accessibility settings so it

means that if the user uses like bigger

font and this the text of your app it

will just automatically scale up so

here I'm going to use this guy because

it is the - your full name and it is

bold so let's use that as the headline

textile is headline like this and it

squeeze down so I'm going to hold

command key click the up tap the equal

one the whole command and equals that I

will open that full scale like that cool

alright next up let's draw another label

for our the handle like that and then

the temp so the handle is due at handle

all right so we'll put it over here and

change the font of this guy but the

punch of this guy is really small and so

we are going to use something like the

caption font so it's that system we use

the caption 1 done see this the handle

again I'm going to come in equal and we

have the handle like this go alright

that's pretty good right next up let's

double click the duplicate this handle

I'm going to duplicate that and we have

the our right so over here now because

we need the kinda like the dot over

there and see that's this dot over here

see this so we need that dot so now I'm

going to hold the option key and click

the 8 key so option 8 or give you that

dot and then two hours something like

this now why do I know that it's just

Google because this song it is and then

lets me pull that as just four and four

looks good

awesome next up let's put out another

label I know it goes a little bit faster

but it's pretty much that is all we do

so you can pause the video if you want

this slower so he had the label let's

put out like the text of the body that

can span around three lines of text

because it only has 140 characters like

that see now biggest winner if you know

about a tweet a tweet can only spins

around 140 characters so

why as is only 140 characters why don't

we just show all of those things right

so I'm going to make the lines into

three lines drag that thing down like

this and to make sure that we have

everything set out let me change this

guy the height of this guy to be

something like sixty four and point five

like this six to four point five just

because I design it already so I know

what is the ratio that's all as we do it

by yourself then you just do enter

landing we will have that set up okay

lastly I have the other glass like we

have the image this here I don't think

we have the image over here there's so

many frames because this is a gift so

let me try and come in here oh here we

go left an image see this this is better

we have the image for the three so

that's out let's check out that image in

the ratio of the image the exposition is

zero the Y position is 100 in 100 it's

over here joy and then the width the

width is three Howard in three point the

height is 170 points all right

let's looks good and it's actually it to

this guy

now why do I have this kind of ruler

tool well I just have to click into one

thing click into one element hold the

option key and you'll see these guy see

this the ruler very convenient tool in

Xcode next up let's have the three bands

for the retweet the oh this is read well

minute I don't even Streeter that much

but I think this is reply or something

this is retweet and is like right so we

have the bunch so bun check out the

first button over here angled goes into

the attribute inspector like this let's

change the image into icon I think there

is like reply yeah

I can reply and then instead of bun

we'll put that it's just like twelve

twelve people reply to this guy and then

the text color has changed the text

color into something like dark white

color oh no this is like gray color

yeah like gray color looks good cool

no actually I have this cuff color from

Twitter yeah this is the two-year

guideline so we are going to use this

code okay so just like that select the

text color and will change the hex color

into this guy the way that you have the

hex color is you goes into the second

chance

the RGB slider and you have the hex

color number yes

pretty cool huh and then I'm going to

change the system font instead of the

system into the caption one like that

and done okay and then domain equal that

it looks good

boom okay and only this thing is really

small right now we will change the

inches on moment which change instance

so that we make sure that it looks good

and actually let me put that in step 12

year into space child so it has a little

bit space cool now let's duplicate this

guy and have another one over here

and instead of the icon reply into icon

retweet right and then come in equal and

then duplicate again so that we have the

last one over here into is that icon

retweeting to icon heart all right so

three months is that easy my friend

and there's the UI for our timeline are

now looking at our complete project you

see that these beautiful you are in the

cells elect out correctly like how

beautifully that is what we get from

auto layout so I would love to give you

a little tour challenge

there's apply Auto layout constraints

into your table view cell so do it now

give it a good solid

18 or 20 minutes do it now and then come

back with me check with me we'll do it

together but pause the video pause this

workshop and do it now apart or not

allow into your constraints into your

cells right now do it alright my friend

did you do it did you apply other life

constraint on these elements that asked

you to do in the minute ago I know it's

just like 30 seconds in the video but

you know and realize you can pause it

right so if you haven't done it please

pause this thing do it by your own and

then come back to me we'll check it

together and maybe I can share one thing

or two about doing this but you have to

do the work in order to make it sink in

not just like doing along with me to do

it now and then we'll do it together

cool so I assume that you already do it

so here we go I want you have this image

ie simple constraints and check

constraint margin 8:8 width and height

that's simple alright cool

next thing is because I noticed that

these three right these three

it's pretty much aligned horizontally

like that and there's a tool in iOS

called stack view allow us to stack

together a bunch of element so that it

would be aligned horizontally or

vertically so the way that we do that is

select all these three elements stack

them together by clicking this little

button over here and this little button

see this click valve here and it stack

together like this pretty cool and then

in the spacing I'm going to change the

into eight like this yeah it looks good

isn't it okay

oops there mess up yeah I mess up here

we go next let's have you know you know

what the art of stack view is you start

from like the minimum stack element so

here what I mean by that you notice that

a bunch of these thing if you put this

thing into a stack this thing you

imagine is another one there's another

one and you see these two even oops

these three bond you see these three

bands it's

also horizontally aligned so what you

can do is also stack these three buns

together so I'm going to click here and

stack those together to don't worry

about like the it's push again together

now because we'll change that in just a

minute see that now let's talk about it

we have exactly over here this is the

stack view and then detect this guy and

this guy and you notice that this guy is

like one line this is just like on line

and this also is like another line and

this too is another line right so again

we can also stack these together so let

me click select the we have no damage

the first stack view the text of the

body right select that in the document

outline hold the command key and then

the image view this guy and the side

view of these three bands we like that

wait a minute I think that we need the

image view do we need the image view

let's just leave at the end we'll do it

together okay so I'm going to select all

these four stack them together like this

again like that

now this is really messed up right now

because we have this label worried

outside and we're a bunch of these

things right so the problem is this tag

view its own so just like pretty much

another rectangle in your UI it's not

like your IV because you argue you can

draw you can do a bunch of other stuff

in here

exactly you cannot draw or do anything

like that matter but you can apply auto

layout constraint on the stack view so

what you can do is select the stack view

not this one that this one okay so the

big one and you put together you can pin

that to the edges so we have a to the

top does get at your left which is our

image view that's good right image view

click over here and then it

of nearly four hours and 22 which is

this label way outta here

we do the eight and then a to the bottom

of the content view of the cell and then

add the four constraints and voila see

that pretty cool is that

nice then let me put this guy the

spacing here into eight like this looks

much better isn't it awesome now the

next thing you want to do is this image

over here the image over here want to

make sure that the size is sized

correctly to do that I'm going to apply

another constraint to this image view

and I'm going to use the ratio constrain

so hold the control key drag it in to

the left like this and have the aspect

ratio click into that and we have the

ratio let's get all right last thing the

image view here let's have this into a

spec field so it looks good and finally

you see the stack view over here in the

stack view of the buttons right we want

to make sure that it also aligned

correctly so I'm going to pin this thing

to the edges of our bigger stack view so

into here zero to left zero to the right

Ain zero to the bottom add the three

constraints and it looks like this

and then you see that this one is bigger

than the other to the white we can have

that is have the distribution I think

yeah distribution here feel equally so

it looks nice like that cool now but you

look at so again I'm going to pin bun of

penis by sac view to the bigger stack

view and then change the distribution

and to fill equally so that it has the

we buns big all equally spaced ohm

around like this but now you look at the

buns over here this thing is still have

this thing in the middle and this thing

is to the right but our is just like all

sinners

--eline how can we fix this one pre

simple we just came to this guy and we

have the control of the active inspector

we can like that to the left of the top

of the retreat

this guy's saner that's good and this

guy to the right of the Horus horizontal

right cool so that is that my friend

only need for our for our wares and for

our and for the hemline so let's go head

into the code and let's code a project

and by the way let's run the project and

make sure that everything is to working

all right so let's run in here we go

where's Danny where's the simulator here

we go so everything is good we have this

is bigger because yeah this is big hi ok

now we get our UI done let's move on

into creating a table view controller

and we'll fetch new treats directly into

that table controller we'll take that

out by printing out new treats into the

console and then we move on into putting

those treats into the beautiful teal

let's do that over your controllers

group I'm going to right click and have

a new file so this file let's have this

as a swift file

and then the save as let's name that

guys tweet table view controller and you

notice this is plural so tweet tail view

controller and create that pop over here

cool so let's import you like it because

we need your kids and then I'm going to

import let's create a class called tweet

table view controller and guess what is

the superclass UI tableview controller

that's right because this thing is a

table view controller right each table

controller before we forgot that let's

go head into the mainland storyboard

change the custom class of this into

treat ko view controller okay next up

let's have some treat all right so in

order to have some treat I'm going to

import our little framework import tweet

over here Twitter like this so over here

let's have a private variable variable

called tweets now what is the data types

of a tweet can be well we know that we

have a class in the framework on tweet

so that is the tact but because this is

tweet so a tan lines of tweet that's why

we want to make it as an array of

tickets right so on the right of tweets

like this but notice because we are

going to fetch tweets in real time into

the tan line that means that we can have

like right now so the first time I fetch

it we can have like twelve tweets right

but then notice that if new to it's

coming out we can have like another 18

tweets so do you want to have this child

to it replace by these 18 tweets or do

you have to again like um a pain

visiting to it in two days all right

that would be a mess right so how can we

fix this well the window with pictures

is we make this tweet into an array of

arrays of tweets again this will make

this tweet into an array of arrays of

tweets so the way that we do that is on

the right of a rise of tweets so this is

on the right right of a rise of tweets

so that means that each of the tweet or

i/o here will be a batch of tweets that

we fetch from Twitter Oh see that

and every time we fetch new to it we

just have to put in another batch over

here and we reload the tail of it that's

pretty neat I love that I love that kind

of data structure cool next up let's

have another

Conte our search tax because we are

going to search for tweet so far such

oops bar search tracks like this it is a

shrink and I'm going to make the

optional because maybe that is nil and

the reason why I make this thing a

public property is because we want

someone else who uses this tweets TV

controller can be able to set this such

text right now

whenever someone let's set our search

text that can be the user typing in some

text inside your search bar or someone

else goes there going to this tweet TV

controller and in search for some tags

search for some tweets right we want to

what we want to reload the Taylor view

and then um so we want to such want to

search for tweets alright so we want to

search for tweet and before we search

for tweet we want to remove all the

tweets remove all the tweet and then I

want to the table that will load the

data so number one we move remove on the

to it we reload the data and we search

for treats oh cool so whenever the

search tag is set we do all these three

things now let's implement our search

for of the function search for tweets

like this now because this is a function

aim it is searching for to it I don't

want anyone to just randomly call the

search for tweets function so let's make

that thing a private method the search

for treat okay now before we implement

this thing let's have a view the load

like this viewdidload and super down

view that a lot and then let's for

example i such tracks i set that into my

to your handle name into something like

this the Chang Shan this is my full name

I don't actually so you have the the

Twitter handle that we want to search

for the tags right so it's just like

we set it that way now let's make a

twitter request so that we can search

for some tweets so the way that we can

have some Twitter requests is let's have

a function Twitter request and this is a

method that we turn files i request like

this and it is optional because it can

be optional so inside here i want to

make a flex the query text to be the

search text we check a dis search text

is available and then we make sure that

the query text here is not an empty

string so the query text is empty is

empty like this right and it is not

empty so if flex this thing is one yeah

this thing is not kneel and this thing

is non empty then here we want to return

a request with the search is a string

with a count here so the search here we

put in the query text the count we put

that by default one Howard tweets and we

return that but if this thing is nil and

this thing is empty then I will just

return nil okay

now where is that request is that is

like a URL requires on any of this stuff

well actually not because if you're

holding command key click into this

request and you find out that this

request is a class from your tweets

Twitter framework and has a bunch of

these in here knowing you don't need to

use any of that stuff to fetch to it all

you need to do know is that it is a

request to search for some treats

okay now let's implement our search for

tweet over here so the search for treat

it like the request is our Twitter

request so we call this Twitter request

and also this Twitter request let me

make that a private function so that it

no one else can call that randomly cool

now if we do that the request

let's do request dot fetch some tweets

so we French some tweet and then

presenter so we have the closure to

handle a bunch of new tweets like this

now inside this closure we have a bunch

of new treats to handle so we will do

stuff with that new treat cool now

there's a problem here though there's a

problem here though the problem the

problem is that we have a bunch of we

have every time we do it like this

right every time we search for new

tweets we are going to create a new

Twitter request you see that in the way

that we do our code here every time we

create new tweets we fetch four new

tweets we have to create a new Twitter

request because yeah because we have a

new search tags nothing it may take some

time to download some tweets and maybe

like if the first tweet request that I

request is with the search text is like

Steve Jobs and then I waited for some

time but it doesn't fetch right this is

show up so I want to search for

something new I want to search for

something like Oprah right so we need

some way to keep track of our Twitter

requests make sense so the way that we

do that is I'm going to have a private

variable here called last Twitter last

Twitter request and the type is request

see that cool and then every time that

we have that over here we're going to

call self dot last Twitter requires or

last Twitter request equals to the

request which is this request so we make

sure that we keep track of the line

with tweet requests but then if you

build the project now there could be a

problem the problem is it says

references to properly last twitter

requires enclosure requires explicit

itself to make capture or semantics

explicit why is what the heck is that

well it only is that we are calling the

last Twitter request which is a property

or it can be if you can call a method in

here inside implementation of a closure

in the closure it requires you it will

capture this property right or the

method so it requires you to call self

dot last Twitter request it's just the

CL language syntax now there's another

problem there's another problem the

problem is this closure right here this

closure right here it will create a

memory cycle because the self reference

that we use in a closure the cell

reference over here it will it will

always keep this TT of you control alive

what it means is that for example inside

our app over here let me open up this

guy right the first the first was that

the first tab is the timeline right so

when I open up like this and we make

some new tweets this thing will always

capture the HK view controller and it

will always it will always captured our

cell here so because of the memory cycle

because of the arc memory that in our it

uses so it always has a strong pointer

to our tweets a view controller that's

why this view controller is always alive

but what if these are those that want to

search for this anymore or this view

controller is like deleted is tossed out

the navigation controller because in

this case it will not but what if like

you use this tweets TV controller just

has some like such reach are you coming

to

one one bun you segue into to another to

the street table control light and then

you search for something but then you

just discarded that out of the stack of

the navigation controller you know what

I mean

then if you do it like this it will

always keep the tkv controller because

there's always this south pointer

strongly point to the table controller

so that we have to make sure that this

is a wood pointer this self is the wood

pointer so that when we're this tweets

table your control is gone the user

doesn't want to use this search anymore

already it's just like deleted this v

controller it will not keep the GTA v

control around so the way that we do

that is we make this wick self so that I

know there's a lot of explanation for

just like 8 characters but it's fair

point and now this out here it can be

Neil so I'm going to make sure there is

self pressure mark

pretty cool huh okay you know what

actually let me put this thing outside

of the fetch treats because as soon as

we have a new Twitter request we will

store that last two requires so we don't

need this question mark but we still

need the which self inside here right

now inside here let's make sure that we

still get the request so if the request

equals equals to ourselves

question mark dot last Twitter request

why do we have to check this why do I

would check this one because maybe the

user like the way this requires already

doesn't want to search for new treats

doesn't want to use this request

well this is a new one so we have to

make sure that so here after that we

self dot tweets and then we insert new

treats right new treats add the index is

zero so that new to it always coming up

on top

cool alright next let's are you know

what let's print out our South tweets I

guess let's print out ourselves up treat

to look and see if we do get some treat

so let's run the app and see if we have

some teeth in our console this is mobile

chew with my friend and let's see how it

looks like here we go and it's running

eggs it is to see the console that are

as a bunch of things over here has

mentioned some of the things over here

let's see this yeah this is some of the

nutrients I just say now over here this

morning let's see that okay cool so we

use that we just have some new treats

awesome now there's a problem with this

though there's a problem with this

though because what I want to do now is

we want to reload out any of you right

so we want to update the day of using

some animation or we want to put up the

tweet into a tail view so we can call

something like self dot tableview and I

want you to insert a new sections insert

sections at the index so the sections

here we want to insert into section

number one of the of sections where the

animation is something like faked so

that it will fade out into the tail view

so new treats will fade out like this

there's a problem with this stuff

the problem is the problem is this fetch

treat disclosure all right here it's

downloading some new treat that means

that it is of the main queue but what is

the code over here

the code area is self detail view right

it means that it is UI code but in iOS

are motor hiding the rule is all new

icon has to happen on the main queue so

our job now is we need to go back to the

main queue so I'm going to solve that

this patch queue done main dot async and

I'm going to cut this code put that over

here and everything is pink

I know I just make a little bit dramatic

but there's a problem with that though

and then here's how you solve that it's

just I hope that it makes a least fun

for you it's fun to make like yeah I

hope that you enjoy it I see that so we

go back to the main key because if you

don't you violate the rule there would

be like severe things happen to your

code awesome

let me make a mark over here little mark

called view controller life cycle and

then let's make another mark for our

tableview datasource all right we got

some tips

does it awesome use now our job is to

put those two into the tail view right

so I'm going to what we're going to do

next is we are going to put up those

streets by implementing the UI tableview

datasource uitv data sauce with three

methods two points so let's get into it

two data source so number one number of

sections interview because we have some

matches of tweets so I'm going to return

the tweets doesn't count so it depends

on how many badges that are inside the

tweets next the tail View number of rows

in each of the sections so return tweets

ad section dot count right so at that

section of tweet the week the number of

tweets inside that section all right

here we go kill yourself or row at index

path or not this will display tail view

cell for row and none will explain

several index pad here we go so let's

implement this guy's number one let's

sell to be tail view that the key

reusable cell with identifier like this

and then I'm going to use the key

reasonable sign with and for index path

so we need an identifier so let's make

that is the tweet sound right so we need

to add

fire here let's go into manor storyboard

we change the identifier of this cell

into the tweet sound just like this and

then go back to your tweet kv controller

the index path we put that index path in

go and now just for now let's get the

let's have the treat

so let's tweet to be tweet at index path

down section and then as index path

don't roll because we have an array of

array of th alright so yeah let's do

something like sound dot title or ticks

label yeah text label dot text to be

that tweet dot something like let's say

cheese subtext just so that we can test

it out and then we'll return the cell

all right we have a bunch of these

things now let's run the app in yeah

looks like I know this thing is has a

lot more UI element in than bug I want

to change it down and make sure that it

works so here we go you see that you

have a bunch of tweets over here for my

handle name

cool see this so there are my tweets

over here and some other people too is

tweeting me awesome good job so far we

create the UI for our app we download

some tweets by some such text and then

we we implement the UI tableview

datasource now let's create a custom

class for ourselves because if you look

at the cell here as the profile image

the name of the user the handle the they

posted and it has the body of the treat

images the balance that requires us to

create some cells some custom UI

tableview stuff let's do it now inside

your views group I'm going to right

click and have a new file this is a

square file and let's name this guy

tweet tail view cell and create that

file

here we go let's import UIKit right off

the back and then let's have the classes

tweet table view oops

tweet tail view cell with the name is

your eye tail view cell like this I

tweet kov shell and uit of yourself so

inside here we don't need any of the

code here we just need a bunch of IB

outlets and IB actions

so let's I'm going to hold option key

click into the manor storyboard and you

will see that we have the tweets out of

here

so let's open it up like this and I'm

going click into the cell change the

custom class into tweet table view cell

right now let's drag out a bunch of

iboutlet and action the first one is the

profile image view cool let's make some

room here we go next one is our profile

over here so let's have that the full

name label touch doesn't allow us check

nothing over here for name label and

then this handle so drag that thing oh

here the handle and handle label or you

know what let's have the yeah handle and

created at label like this so we'll make

sure that this thing is just like the

same so I'm going to double click here

cut this tags I got and I'm going to

delete this to our so what happen is I

will make this the same see you guys

I'll make this the same label

like that cool okay next up let's have

the body text so check this thing to the

screen and let's have this analyte to be

the tweet text label like that let's

listen

delete this thing really that do like

this awesome

over here let's have the tweet image

view so this image we drag this to the

screen and tweet image view okay

now lastly these three buns so the first

one the first one we have is the reply

bun create that second one the retweet

back so retweet bun and finally our like

bun so like bun like that cool so

everything is set up

that's rad let's open up these standard

editor so that we have some space to

work on so in fact yep let's implement

this tweet teo view controller to ETV

selves are number one where is the

public API meaning at what is the data

model one we can have for a treat right

so this is a treat now in order to have

this we need to import the old frame

Twitter framework so tweet here and now

by the way if you don't have to treat

Twitter a means that you have downloaded

the complete of the starter project

that's on download storage again you see

that so tweet here and let's make that

optional because it can be meal so

whenever someone let's set this guy I'm

going to update the UI something like

this and this C now this thing it is

just like a fancy ways of doing this

okay see that it's just a fancy way that

you can do it on online that's all

you guys agree all the heavy updates UI

so here let's

the private funk count update you I like

this updates you are so inside this

updates UI let's put out some

information for the tweet so treat

checked label the text to be the tweet

dot text full name label dot text to be

I'm going a little faster because it's

just some property that you can explore

in your tweet struct to have the text

user created all those things it should

be easy enough for you to to see right

so inside here let's have a let's create

it our trip created at date so if let's

create it equals the tweet dot created

like this and then we do let's the

formatter equals to a date formatter

then if the date that time interval

since not since the reason is out date

since the tweet Oh

since the created over here like this

and we do it dot greater than 24 times

60 times 60 who is that a days ago right

one day ago then we do formatter the

date style to be done short else the

formatter the hamster tweet dot sort and

then let's do let the created text to be

the formatter the string from our

created the date over here the created

of the tweet awesome now lastly let's do

the handle in created at label dot text

the text to be our a string and this

string is number one is the tweet dot

user dot screen name the screen name is

the he know and we have the add sign so

add like Steve Jobs at Tim Cook as Elon

Musk right and then we need that done so

commotion eight so we have that dot and

then we have their created tags this guy

and I'm using string interpolation over

here also else case let's have an else

we do handle and create an add label

text to be another string and this

string has the handle so only this

handle so why is happen if we don't have

this created add we all have the

screening and that is required right

towards us now let's run the app and see

how it looks like here we go should be

beautiful if it's not man is your fault

though it's my fault

okay so let's see it alright so we have

a bunch of things over here oh-oh what

happens is weapons is in the treat kV

controller we didn't set our new class

so in cell in here delete this line we

do as the tweet table view cell right

and then we do self dot tweet to be the

treat run the app and cell looks like

here we go beautiful ha ha all right I

love it

pretty nice to see that really nice love

it all right now but there's a problem

though there's a problem though the

problem number one is I want to make

sure that we don't be able to select

this guy right as you see this I don't

want to have the select color so the

white is you that is dot sound on

selection style to be none now the

selection style it all only means is

that we don't show up this grayish

selection cool um and it doesn't mean

that you can also liked it it means that

you just saw here we still be able to

call the tailor you did select row index

pack so now let's run the app here we go

cool so if we select here there's no

grayish foolish thing and then the

second one is I want to make sure that

because our from our complete project

over here you see this the separator it

doesn't have an offset so this thing has

a little 16 pixel offset so the main is

stubborn go there click into the tail

view I believe and you see that the

separator the sobriety are over here

let's change the default into a

separator in set custom the left here is

zero so now let's run the app

here we go beautiful here we go

this is the hard part I will need to

download our images from Twitter

right because each of the user has some

profile image and has they have some

some tweet has some image some G doesn't

have any image at all so how can we deal

with this stuff let's do it in this

section of the training rule download

the profile image first and then we'll

move on and download the tweet image for

any twitter handsome image so let's do

it

alright there are a few things I want to

do before we download our images number

one is if you look at our navigation bar

of the final project you see that we

have a ghoulish dad let's call the blue

navigation bar that is the color from

our yeah from the Twitter so let's do

that I'm going to the app delegate over

here the app delegate and you see that

we already set our UI tab our appearance

tint color UI color all of these things

because inside your Start project I

already did that for you so what we want

to do now is we want to have this

navigation bar to be blue and then this

thing to be white and maybe you want to

have the title of your navigation to be

y2 now here we have a text search bar so

we don't see the title then whenever you

have the title very much likely you have

like in the moment notification messages

on me you have a title right so to do

that I'm going to use this little piece

of code here all we did is we set the

appearance proxy of the UI navigation

bar we set the bar tint color into this

bluish color and then we set the tint

color into white and we set the bar

style to be black so that this standard

bar could be white cool so now if I run

the project here we go

let's run that and you see that we have

the title and we have the navigation bar

three nice right so that's one thing to

take care of let's move on and see the

complete project we have the avatar

where the profile image here so let's go

ahead and download our profile image I'm

going to the Treaty of you sell retail

themselves and here we have a treat

whenever this treat gets it set then we

will update the UI right so let's

download our treat now from the trip you

can get the profile image profile image

URL to be the treats dot user dot

profile image URL and then from this URL

I'm going to create a request which is a

URL request with the URL of our profile

image URL the reason why I'm going to

use this URL request is because in your

star project I want to prepare for you a

class called network processing now if

you don't need to if you already like

studied with me for a while and you're

in some of my programs like socialize

your abs or Irish masters or total ice

blueprints you see me teach this class

very often Network processing only did

is we construct a networking stack that

allows us to download data from the

internet with Chas a URL request which

is a URL and we have download Jason or

download data into Jason format or we

download the data we download the data

right so we download the data into in

its data or actually data types so here

let the request yin let me create a

network processor to be network

processing process hanging out given

name request is our request from this

request

let's count I'm sorry from the net

processor let's come download data

presenter and we have a closure this

closure contains some arguments number

one is the data that's what is that data

yeah the image data and then we have a

HTTP response you can check the status

code and all those stuff and we have an

error now here you can check all of

those tabs but I'm going to just do some

very simple thing it is that a we check

if we do get the image data if we do get

the image data then I'm going to come

solve the profile image view dot image

to be your image with the data of our

image data right see that cool now

there's two problems with these though

there's two problem goodness where's the

problem can you guess can you ask why's

the problem the more one is the self

yeah this self strongly point to our to

the closure to this table you sow right

that's why we have to make this a wick

self make sense and here going to be

self question mark number two number two

problem is this card over here is you I

could but then this thing is of the main

queue this closure is of the main queue

so we have to dispatch this dispatch Q

dot mean the async and we have the code

we were cut this code over here in book

Revie thank you

make sense

all right now let's run the app and see

how it looks like I'm going to run the

app here we go and boom you see this you

have the C then you have the profile is

pretty nice all right

what if we don't have the profile image

then in the Al's case Here I am going to

do the profile image dot image to be nil

to be Neal in question mark here right

make sense

awesome so that is the profile image but

before we move on I want to make sure

that we have this profile image to be

rounded corner because if you look at

this thing it is rounded corner so a

very convenient way that we can do this

is I'm going to make a private extension

of the UI view now you are view is the

superclass of your image view or

anything that's like drawing on the

screen is is a subclass of UI view right

so Y am going to have a function called

rounded corners like this and only that

here is it will apply the layer the

corner radius corner radius into the

south and then we do this layer mask to

veiners to be true and because it is an

extension of your iView it means that i

can count the self dot profile image

view down rounded corners like this and

it will automatically come this meta and

it will like this profile image to be

rounded but there's two questions though

why do we want to use an extension an

extension allows us in Swift to add

other functionalities and other

properties into a type that you don't

need to have access to the

implementation of that type of the class

or the struct or the enum cool number

two question number two why do we want

to use the private over here the private

over here marks that this extension is

only accessible inside this tweet table

view cells with that's why outside of

this class no one else will be able to

con the rounded corners and in some

cases that may be not what we want in

this case that may be true because we

don't want anyone else to like somehow

calm the rounded corners without knowing

that this router corner is inside this

right it is not a built-in is not a

native UI view method so that's why we

don't want any we want to be able to

access that my sense so now let's run

the app and see looks like okay looking

good looking good

beautiful all right now last thing that

stings let's download our treat image so

before I actually show you how to do

that it's pretty much the same okay so

can you try and you give it like five

minutes try to do it on your own and

then come back with me do it together

with me alright so give it five minutes

go

all right why did you do it here we go

this is how I'm going to do this let me

make sure that we're still in the

updateui here we go so I'm going to if

let's get the media item now this

requires you to read the tweet IPI a

little bit so I hope that you already

did that we get the media item from the

trees is tweet media if the tweet does

get the media because sometimes the tree

doesn't have an image so then we had the

a flat media URL to be the media item

that first dot URL because this media

item may have multiple images and then

let's get a request let's the request to

be URL request with the URL of our media

URL and again we do the network

processor processor to be our network

processing with the request of request

now a question wise my right side is hey

why do you have two instances of network

processors the answer is because we have

different requests that's why all right

so here like walk processor dot download

data and the completion image data the

response in the error right and then we

do if let the image data to be image

data then we do self dot tweet image

view self that tweet image I'll do a get

the tooth image view yeah to the imagery

oh yeah

the cell we need to do the would self

and then we self that's with image view

the image to be aur image with the data

of image data awesome then shall done to

it image view dot rounded corners so now

we have the rounded corners immediately

right

cool all right now what if we don't get

any media then we just do one we just do

two it image view down image to be near

and what if what if this media doesn't

have a URL because there's some errors

right so yeah we own some like dancing

beat image viewed to be real awesome now

let me run the project ends here looks

like there will be some problem but

we'll find out Hawaii right so let's see

here we go ah these thing doesn't have

any images suddenly Charlie ain't search

for something new there's something that

might because this search text is pretty

much doesn't have my name I don't use

Twitter that much that's why I don't

have anything so let me try and find

something like interior design to really

telling let's run in because until here

design pretty much is like maybe people

were putting something here right some

images okay so um yeah here we go

we have village that's wow there's a

beautiful house

Wow let's be fast and see we have a

bunch of a bunch of we don't have any

other image let me see okay now this is

some problem with this as you can well

see is that on two cells right this out

and this cell this is an image that's

why it is the smaller but the cell it

doesn't have an image why does it have

to be like this tall right why does it

have to be that tall let me see what we

have anything over here so the main

threat okay

this application is modifying the auto

layout engine from background thread

after the engine was accessed from the

main threat this can lead to engine

corruption and weird crashes well why is

it one because of your get the treaty of

yourself and what we just did over here

inside the closure there is too much we

change that

data insight we change the truth image

view you I caught right off the main

threat so was that was that this patch

queue this patch queue doesn't mean that

I think you move up code here over here

and run the app once again it looks like

okay I know that it's a little bit fast

so all I did is I have this move oh by

the way did you see that the problem is

that there's a bunch of images right

there's a bunch of images over here but

before because we did our queue over

here wrong that's why we don't have

those images I think we have a lot of

images but before we don't have all

these images now this is a huge

challenge now that I'm challenging you

but this is a huge challenge for us to

deal with this situation

is that there are some cells some tweets

they have some image some dish doesn't

have an image at all how can we deal

with this stuff because now when we have

the Taylor view set out if the tweet

doesn't have an image it's still that

tall how can we deal with this that is

what we're talking about in this section

we'll talk about how to create a tweet a

looser height so that it would

dynamically Rahzel the height and there

to actually two solutions to this number

one we create we can create two

prototype cells all of these things are

the same but one prototype cell will

have the image one doesn't have one

image now that may be good because it's

easy to do but is kept like repetative

forever the difficult sometimes like we

have two subclasses we need to have

maybe not two subclasses but it's just

like we need to have two prototype cells

with the same UI it means that later you

want to change the UI then we have to

change two

cases this Intel so another solution is

we only have one protect and we'll use

code to programmatically set the height

of the cells let's do that so let's fix

that problem this cell doesn't have an

image and itself has the image but it is

pretty much the same height so let's fix

that thing

step number one I'm going to do is if

you look at this image right we always

have the image we always have this image

in the storyboard and if you look at

this image we can actually set the auto

layout constraint for this image so let

me do that I'm going to control hold the

control key drag it up like this and I'm

going to set the height constraint for

this image

now when we do it this way it is not

that we always set a default height or

always set a fixed height for the image

but rather what I want to do what I want

to do is I want to open up the truth

table result on the right-hand side on

the assistant editor over here like this

n lets me find this sweet image view

like this and what we can actually do is

we will have a auto layout constraint

I'm sorry

we can have an iboutlet we can have an

iboutlet let me Marga here mark in over

here called dynamic cell height for

treat with or without an image so what

we can do is I will create an iboutlet

from this constraint over here you see

the height equal 170 so I'm going to

right click on here to this guy to

create an outlet for this NS layout

constraint so let's call treat image

view height constraint treat image view

height constraint I know there's a lot

in name but you can do that anything you

like as soon as as long as know as soon

as as long it is make sense for you so

now what we'll do is I will create a

private variable that can't default

treat image view height constraint which

is of typed CG float because a constant

of an AI NS constraint layer constraint

is ICG float and what we'll do is when

this cell when the cell gets the image

and the image gets set when the image

gets sent right will change it will

change the diskens this constraint will

set automatically because we change the

image but what if this image here

doesn't have any image then if it

doesn't have an image we do the default

tweet image view height constraint to be

the tweet image view height tweet image

view height constrain like this right

from the storyboard not constant so that

will save the default to image we hide

and then and then we'll turn off this

high constraint so we will delete go

pretty much the image is still there but

we'll make the tight constraint of the

image to be 0 so what we'll do is tweet

image view height constraint dot

constant to be 0 and then I'm going to

call layout if needed

let's see this so this will help us to

prepare for the case that this is no

image if there is an image it will set

over here and this thing will get set

and the layout will watch itself out but

what if there's no image if there is no

image stay number one is as good save

the default high constraint constant of

the high constraint so then later on

when this cell gets reused remember

because this is a Taylor view or you use

a collection view this

will gets reused that's why we are going

to like will save this constant and then

we make the constant to be zero because

we don't have an image and we can't lay

out if needed so that the cell will lay

out all of its abuse MXN so I hope it

makes sense if it doesn't please request

the last five minutes now when this cell

get prepared for reuse we call the super

the prepare use and then I'm going to

check if the tip imageview hi constraint

is not meal and the default tweet image

height constraint is not kneel because

there are some cases that this propeller

use is called before the story 1

instantiate those element first so here

we do treat image view hi constraint

treat image view hi constraint that

constant to be the default tweet image

view height constraint why is it when

this cell gets reused

we will reset everything so it becomes

the stage that you see on the storyboard

right so if it doesn't have an image it

will set it with this layout but if it

doesn't have an image it was said it

like this so see that okay now we also

need to do that in this tweet image view

like this I know this is maybe like

duplicate duplicate code we can factor

that out other has actual three lines so

then you can do that cool so now what we

can do is run the project and see a

looks like I hope that watch but let's

just see guys let's just see and see how

looks like ah here we go so here we go

ah gosh so it looks cool yes but look at

this it it sucks right it's care of our

buns and we don't want that but now this

is this is a good thing a good thing is

that there's no image over here because

that's why I scale up because these are

the stack view over here in the spectra

of the buns it would text the rest of

the layout and I'm sorry the rest of the

space of the cell so this problem is

very easy to fix

why is it it's just because this tail

view it doesn't have any information

then this cells wants to be

automatically to be dynamic height so

what we can do is in viewdidload of the

Treaty of your controller I'm going to

count table view the estimated row

height to be the tail view row height so

it will say to the chair view

hey this is your estimated row height it

will be pretty much the same row height

from the storyboard so I just want to

give you a clue that the height of your

row could be pretty much like this but

then high tail view your row height is

actually I want you to automatically

change the dimension of the height so

resize the height of the stuff of the

cell according to what I tell you in

Auto layout constraint you'll see that

it comes into a full circle now right so

we have a height in storyboard we set

all of the elements inside the

storyboard and then we apply Auto layout

constraints into those elements and then

we tell the tale view that hey this is

an estimation of your height but

actually I want you to resize the height

of the row according to what I taught or

layout in the storyboard or if you do

that in colleagues would pretty much the

same it makes sense right okay so now

let's run the app and see how it looks

like

all right

oh wow it looks so good yeah we have

this thing looks nice and these guy gosh

why was it

yeah people eat so much and we have this

see that this see this thing yeah we

have the image and it's resized

the height of the cell it looks nice

yeah

beautiful beautiful awesome alright

lastly a search bar so you notice that

we have a search bar over here we have

the searched item here right we can

search anything

so now if I search for Oprah and book

see we have the new treats that we have

some information about Oprah showing up

so that let's talk about the search bar

we put up the search bar

programmatically in the street team you

could tell us till now as I tell you in

the beginning of the training that we

are going to do the search bar

programmatically so inside your to tell

you controller above here I'm going to

have a search controller of tagged UI

search controller like this you are

search controller right so this is your

search controller inside view the load

inside view the log where's the middle

note here we go

inside video learn I want to count let's

yeah let's set the search text by

default to be the interior design

something like this and then let's count

of method calls

set up such controller like that and

inside the setup funk

and private fun set up search controller

inside the set up such controller let's

instantiate a such controller to be UI

such controller with the such result

controller to be Neil like this and then

I'm going to come to such controller

will set up the such control

that highs navigation bar during

presentation to be Fox so it will always

keep that navigation bar next let's

search controller

I want to beams the background during

presentation to be true so that I don't

think we have the complete project here

but let me show you in the project here

we go

so when we search that you see let's let

here galaxy that it would beam tell it

will go out the background of the whole

screen so we have that and then such

control

let's do navigation item navigation item

that kind of view it has the title view

so this is the title label right now

that is the title view we can replace

that title view within such controller

and the view of this such controller is

a search bar and I'm going to kondeh

find presentation context to be true so

let's run the app and sell oh yeah

expected Oh where's that ok ok this is

just like this run the app and see how

it looks like here we go run it boom we

have the search bar and if I click into

this you I don't think I'm you will see

it maybe you don't see that clearly but

here I can see that it will deems out

like that pretty nice huh ok and if you

don't see the keyboard you just have to

hold the ctrl key click ok I'm sorry

come on K yeah comment cat and you can

typing in something like this click

search and it will search our world go

close out the thing cool alright now

lets me set the such controller that

search bar that delegate to be ourselves

to be ourselves because i want to make

sure that we will create let's create an

extension over here so that the

extension of tweet table view controller

will conform to you

I search you as such by delegate now

this is tension is just that a kind of

like way or a habit that whenever

implementing a new a new protocol or

yeah a new protocol or a new delegate

method I'm going to put that into a

different extension of the class so that

it will separate out our code so you

know I'm going to a march of search bar

delegate like this and then inside this

extension let's do search bar should

begin editing so whenever the search bar

starting to add in we're going to check

if the search bar is actually that's

such controller not search bar if this

search bar is actually outside

controller search bar then I'm going to

come to the search bar that placeholder

to be at ex-cons such Twitter like this

and will return true so what happens is

right now the neap the placeholder is

such right but then if I cling to this

is still such you see that so what

happened what we want to do is going to

cling to that it's still such Twitter

here we go so now it is such cling to

this is is such Twitter I actually want

to be by default like this the such

controller such controller that search

bar dot place holder oops

by default placeholder to be such

Twitter to see that so now let's run the

apps so inside your setup

controller we send the search bar in a

placeholder that's such controller to be

that see that such Twitter okay are

angry still have that thing awesome next

up let's do the search bar search bar

such one-click so whenever we count we

click on over

yes timing some text we have the search

this method will get scold see that so

if the search bar equals equals to the

such controller that search bar so then

we make sure that it is that search bar

just in case just be a safe problema and

then we change the such tags to be our

search bar dot txt and we count the

search controller because now if I click

over here right I click search and it

pops down the keyboard but it still be

like this thing it is still active so I

want to do the search bar that is active

to be oops is such bar is active right

equals to false oh I'm sorry

apology this is such controller is

active is Fox so now I can run it run

the project come on come on 1 2 3 4 5

run here we go and if I let's say it's

social taxi I search and it goes down

over here to see then all right so two

things two things that we want to do

number one is whenever I typing in some

such texia click search and this thing

becomes back into such Twitter see that

it becomes back to such Twitter but I

actually I actually want it to be still

that type UTG still that UT t so that's

user knows that they are searching for

that thing

alright so how can we do that well as as

we just sent our such tags to solve the

search tags to be the search bar that

tags inside our such text over here

inside the search text string we can

actually set our stuff

so before we remove all those stuff let

me do such controller dot search bar

tax to be the such oops

such tanks now why do we need to be

optional chaining here why do we need to

optional chaining here yeah is it I'm

asking you I'm asking you why do we need

optional chaining here what we just

doing like this because it's actually we

can do that because the such controller

yes it's not an optional it is an

imbecilic

and grant optional why do we need

optional chaining here yeah because this

such text the first time it get descent

is interviewed load before we ever get

an such controller that's why if we call

really will crash because the such

controller is nearly nil right it's nil

then let's do such controller dot such

bar dot placeholder to be the search

text to so such text like this and never

run the project let's see how it looks

like and we actually go such the treat

email a winder such htech good set see

that so whenever the search tag is set

it will do all these things and it will

search for to it with a new text so here

let me call something like to try I

don't know if there's anything over yes

see this okay we have a bunch of things

over here let's see how about Oprah such

and whoa beautiful image over here

awesome awesome

alright my friend that is how you create

the tweeter

app using Twitter API now I hope that

you enjoy this episode I hope you enjoy

this training as much as I enjoyed

creating it for you if you do you do it

to five hours number one can you

subscribe to this channel so that I can

continue to deliver free trainings video

tutorials for you every single week and

number two what would love to give you

is this new training that I have here

it's called how to build Nike ecommerce

retail store without

losing your shirt now muscle thing that

it would take like I and personally I

use the thing that would take Howard of

people thousands and thousands and

thousands of dollars so not only to put

out just an MVP of an app like this and

inside if you looked at if you do some

searches most people invest like fifty

thousand dollars on how a thousand

dollars just to create the Minimum

Viable Product for a retail app like

this we would love to do for you is I

want to give you the basic guidelines of

how to do this and will improve main

part of that training in my new training

course how to build the NAG ecommerce

store without losing your shirt so well

if you love to have this training all

you have to do is goes into a link in a

description could then enter your name

and email so they can send you this

training all for free how to do the Nike

ecommerce store so go there click the

link on this page download that training

and I see you in the training until then

my friend go out every single day of

your life learn new things craft ideas

and contribute to the world