In this section we're going to walk through the set up of each Slint inside of the atom code editor.
So if you're not using atom you'll want to skip on to the next video that covers your very particular
code editor is set up for Eastland is different for each editor and that's why we've got a series of
different videos to explore how to set up yes linked with different editor.
So with Adam let's get started.
I've opened up my Adam editor inside of a project directory here and in our case it is our reac native
project.
But it doesn't matter what type of project reason Heslin for with it can be re-act native Riak J.S.
Amber angular whatever it wants to be doesn't matter.
So inside this project directory I'm going to open up a single file called index.
I went on.
Yes.
Now the only reason I'm opening up this file is so we can test out our Linter and make sure it's working
after we install it.
So let's get started with the installation up at the very top left hand side.
I'm going to click on out them and open up my editor preferences
then on the left hand nav bar inside the preferences pane I would click on the install section and then
inside of install we're going to search for a very particular package called Linter dash.
Yes lint
the first result that I see here is the Linter dash.
Yes lint package and I will install it on the right hand side.
And I'm also going to find the next package right beneath it.
That's called Linter.
If you don't see the next one on here is being winter.
If it's anything else then you can just do another search for the or package itself and find it and
install it.
So we're also going to install Linter as well.
OK.
So installing these is going to take just a moment of time.
So while that's occurring we're going to flip over to our terminal and do another little bit of setup
we're also going to pull up our diagram on how yes lint works right here.
So at this point in time we just started the installation of the Linter attached to Adam and Eve Slint
the plug in that's going to run inside the atom editor as well.
So now we need to install our configuration some pre-built set of rules for our Linter installation
to run.
So we're not going to write a rule set from scratch.
We're just going to use one that has already been put together for us.
So to install a Already pre-generated pre-built list of excellent rules in my project directory I will
install NPM modules so will install with NPM install dash dash save dash dev.
We're going to install this as a developer dependency and then we're going to install Yes Slint dash
config dash Rallye coding like so.
All right so let's install this and just let it do its thing.
And while that's going I'll also check out my item preferences and just verify.
OK.
Both of them appear to have been installed successfully so I don't need any more settings any more.
So close the settings pane at the top and I go back over to my terminal and just verify this installation
is going to wrap up here in just a second.
OK.
Well that's just going to take forever.
So that's going to last up for set up that we have to do.
So we have to make sure that yes lint knows to use that rule set up or that rule bundle that we just
install via NPM to tell us lint that we want to use that bundle of rules.
We're going to add a configuration file to our project.
So inside of my project directory I'm going to create a new file called Dot.
Yes lint.
RC So Dot make sure you add that dot on the front lint.
RC So any setup that we want to do for E.S. lint for this particular project we add to this file right
here.
Remember this is going into the realm of project specific settings.
So on every project that I start off where I want to use E.S. Lent I will need to add yes excellent
RC file.
Again this is project specific set up.
So inside if you will do a little bit of project specific setup us I'll add on a set of curly braces
to specify an object and then we're going to put in an inside of very specifically double quotes.
The word extends with the key of Raley coding like so make sure that you've got double quotes on both
extensions and Raley coding.
So what this tells us Lin is to go and find a installed dependency inside the node modules directory
which is what we just installed called Rallye coding.
So we just installed and it looks like it just wrapped up successfully.
We just installed an excellent config called specifically Rallye coding.
So we're just telling.
Yes Slint.
Hey go use that configuration.
We just downloaded.
All right.
Now the last step I'm going to close out the excellent file and to close out the index file and then
reopen it and then once I reopen it.
My.
Yes.
My Linter should be active.
So if I start deleting some code you'll see that I start getting some error messages popping up on the
screen specifically in this case.
You know I just delete the semi-colon so it says a year Miss missing a semi-colon he can't do that.
But then we can also start doing weird stuff like I don't know have a plus plus plus plus plus.
And yup that looks good says Persinger unexpected token because we did a bunch of pluses and a sign
in a row of your OK so that's it with yes Slint inside of them.
That's all the set up we have to do.
The one thing to keep in mind is that on any future project where you want to use.
Yes lint you have to create the Slint RC file.
Paste in this configuration and then you also need to install the yes Slint config Rallye coding package
as well.
Remember this package right here just contains a list of different rules to tell excellent how it should
validate our code.
OK so that's our setup.
Let's get continued in the next section.