1
00:00:01,022 --> 00:00:04,883
[MUSIC]

2
00:00:04,883 --> 00:00:06,255
Hello and welcome.

3
00:00:06,255 --> 00:00:11,710
I'm Alena Holligan, a PHP teacher here
at Treehouse, and long time developer.

4
00:00:11,710 --> 00:00:14,820
Most developers prefer to
build applications locally,

5
00:00:14,820 --> 00:00:18,800
on their own computers,
rather than on a hosted server.

6
00:00:18,800 --> 00:00:21,400
Working locally,
allows you to work more quickly.

7
00:00:21,400 --> 00:00:25,530
Because you don't have to wait for
changes to be saved to a remote server.

8
00:00:25,530 --> 00:00:28,930
And, you don't have to worry about issues,
like Internet connectivity.

9
00:00:29,990 --> 00:00:33,670
Working with files locally also
allows tighter integration,

10
00:00:33,670 --> 00:00:34,580
with development tools.

11
00:00:36,020 --> 00:00:39,750
In addition, one of the best things
about programming as a career,

12
00:00:39,750 --> 00:00:41,650
is the ability to work from anywhere.

13
00:00:43,140 --> 00:00:46,950
While all these reasons are good,
the most important reason for

14
00:00:46,950 --> 00:00:49,090
having a local development environment,

15
00:00:49,090 --> 00:00:52,950
is you should never be working
directly on a production server.

16
00:00:52,950 --> 00:00:54,940
Always test your code before it goes live.

17
00:00:56,070 --> 00:01:01,190
To make use of these advantages, we need
to set up a local development environment.

18
00:01:01,190 --> 00:01:04,454
This means installing
the programs we need for

19
00:01:04,454 --> 00:01:07,472
our local computer to
work as a web server.

20
00:01:07,472 --> 00:01:10,590
Namely, Apache, MySQL, and PHP.

21
00:01:10,590 --> 00:01:15,750
There are many different ways to set
up a local development environment.

22
00:01:15,750 --> 00:01:18,640
Most involve at least some
use of the command line and

23
00:01:18,640 --> 00:01:20,890
can be pretty scary if you
don't know what you're doing.

24
00:01:22,730 --> 00:01:25,380
I'll be showing you a quick and
simple method,

25
00:01:25,380 --> 00:01:29,780
which will allow even complete beginners
to get up and running within minutes.

26
00:01:29,780 --> 00:01:34,940
Make sure you check out the notes, for
more resources and advanced options.

27
00:01:34,940 --> 00:01:36,893
Let's get started!

28
00:01:36,893 --> 00:01:40,007
In our web browser, let's search for MAMP.

29
00:01:40,007 --> 00:01:42,600
The first one is MAMP &
MAMP Pro at mamp.info.

30
00:01:44,090 --> 00:01:46,820
Click on Downloads and
then Download again.

31
00:01:48,220 --> 00:01:52,410
This may take a little while to download
depending on your Internet connection.

32
00:01:52,410 --> 00:01:54,590
Once the file is downloaded,
open the installer and

33
00:01:54,590 --> 00:01:58,160
it will guide you through these
necessary steps to install the software.

34
00:01:58,160 --> 00:02:01,861
Make sure you allow it to
make changes to the computer.

35
00:02:01,861 --> 00:02:03,461
Choose your language of choice.

36
00:02:07,088 --> 00:02:11,310
And if you'd like to install MAMP Pro
at this time, leave the box checked.

37
00:02:11,310 --> 00:02:14,340
If you want more information about
MAMP Pro, check out the notes.

38
00:02:16,170 --> 00:02:18,571
Make sure you read and agree to the terms.

39
00:02:26,229 --> 00:02:27,540
And let the software install.

40
00:02:28,890 --> 00:02:33,010
MAMP & MAMP Pro have been installed
successfully you may close the installer.

41
00:02:33,010 --> 00:02:38,270
Go to your C drive, where you will
see the MAMP the MAMP Pro folders.

42
00:02:38,270 --> 00:02:42,180
You can also launch MAMP from
the shortcut if you created one.

43
00:02:42,180 --> 00:02:47,860
And MAMP we'll go into MAMP and
this is where the magic happens.

44
00:02:47,860 --> 00:02:52,070
It starts our server and
turns our computer into a web server.

45
00:02:52,070 --> 00:02:55,920
We open the start page and
we'll see information about our server.

46
00:02:55,920 --> 00:02:59,340
We'll see our MySQL install
which is our database.

47
00:02:59,340 --> 00:03:03,630
You have your tools,
either phpMyAdmin or phpLiteAdmin, for

48
00:03:03,630 --> 00:03:05,620
administering the database.

49
00:03:05,620 --> 00:03:10,230
Also, phpInfo for
all the information about our PHP install.

50
00:03:10,230 --> 00:03:13,890
For now,
take off everything after localhost and

51
00:03:13,890 --> 00:03:15,580
this is where our website is.

52
00:03:15,580 --> 00:03:19,010
Right now, it just says Index of/,
because there's nothing there, so

53
00:03:19,010 --> 00:03:20,820
let's fix that first.

54
00:03:20,820 --> 00:03:21,780
Open you text editor.

55
00:03:23,560 --> 00:03:24,560
And let's type Test.

56
00:03:25,910 --> 00:03:33,470
We're going to save this
into C://MAMP/htdocs.

57
00:03:33,470 --> 00:03:36,970
This is where MAMPS stores our files for
our website by default.

58
00:03:36,970 --> 00:03:41,240
Type index.php and hit save.

59
00:03:41,240 --> 00:03:45,360
Now when we go back to the browser and
refresh our page, we'll see Test.

60
00:03:45,360 --> 00:03:50,970
If I go back into MAMP and stop
the server, and then go back into my web

61
00:03:50,970 --> 00:03:56,830
browser and click refresh, we're gonna get
an error because our server's not running.

62
00:03:56,830 --> 00:04:01,730
So before you test your website, make
sure that you start your servers in MAMP.

63
00:04:01,730 --> 00:04:05,170
Now, when we refresh,
we see our website again.

64
00:04:05,170 --> 00:04:06,070
Congratulations.

65
00:04:06,070 --> 00:04:08,230
Technically, that's all we need to do.

66
00:04:08,230 --> 00:04:10,930
However, I want to show
you one configuration step

67
00:04:10,930 --> 00:04:13,630
that will make our
workflow a little easier.

68
00:04:13,630 --> 00:04:16,895
Most people find it better to
work in the Documents folder,

69
00:04:16,895 --> 00:04:20,845
usually within a sites folder, and
then separate folders for each project.

70
00:04:20,845 --> 00:04:22,435
So let's set that up.

71
00:04:22,435 --> 00:04:27,055
We'll go into our text editor, and
here we're gonna just add Documents, so

72
00:04:27,055 --> 00:04:29,485
that we know that it's
looking into a new location.

73
00:04:29,485 --> 00:04:35,320
So we go File > Save As, and
we're gonna go into our Documents.

74
00:04:35,320 --> 00:04:37,330
Create a folder called sites.

75
00:04:38,760 --> 00:04:41,145
And then a new folder called testsites.

76
00:04:42,820 --> 00:04:46,100
We'll leave it as index.php and
click Save.

77
00:04:46,100 --> 00:04:50,107
Now we go back into MAMP and
under Preferences,

78
00:04:50,107 --> 00:04:52,821
you'll see the Web Server tab.

79
00:04:52,821 --> 00:04:57,537
You see that the document
root shows CMAMP\htdocs.

80
00:04:57,537 --> 00:05:00,672
This is what we want to change,
so click Select.

81
00:05:00,672 --> 00:05:06,680
Go into Documents > sites > testsite,
and click OK.

82
00:05:06,680 --> 00:05:10,870
Now we click OK again, and
MAMP will restart our servers.

83
00:05:10,870 --> 00:05:13,020
Now when we go back to the web browser and

84
00:05:13,020 --> 00:05:16,940
click refresh,
we'll see that it says Test Documents, and

85
00:05:16,940 --> 00:05:20,220
we know that it's now looking in
the new location for our website.

86
00:05:21,420 --> 00:05:25,090
If I wanted to have multiple projects,
I could set that up with MAMP,

87
00:05:25,090 --> 00:05:28,770
without using MAMP Pro,
by just changing our root document.

88
00:05:28,770 --> 00:05:33,990
This will allow me to have multiple
websites, but only one running at a time.

89
00:05:33,990 --> 00:05:35,195
Let's give this a try.

90
00:05:35,195 --> 00:05:39,156
Go back into your text editor and

91
00:05:39,156 --> 00:05:43,707
we're going to say Test Website 2.

92
00:05:43,707 --> 00:05:52,071
And then we're going to
save this as testsite2.

93
00:05:52,071 --> 00:05:54,820
Leave it as index and Save.

94
00:05:55,920 --> 00:05:57,040
Now we go back into MAMP.

95
00:05:58,290 --> 00:06:04,912
Back to our preferences, our web server
and we're going to change this location.

96
00:06:04,912 --> 00:06:10,245
So instead of being in this testsite
folder we're now going into testsite2.

97
00:06:10,245 --> 00:06:12,950
We'll click OK, and OK again.

98
00:06:13,980 --> 00:06:18,350
Again, our servers will restart, and
then we can go back into the browser.

99
00:06:19,480 --> 00:06:24,070
Now when we hit refresh,
you'll see that it says Test Website 2.

100
00:06:24,070 --> 00:06:27,320
So now we have two different
websites that we can go back and

101
00:06:27,320 --> 00:06:30,360
forth between using just MAMP.

102
00:06:30,360 --> 00:06:33,866
Remember, if you wanna test out your other
site, you need to go back into MAMP,

103
00:06:33,866 --> 00:06:39,230
Preferences > Web Server, and
once again, change the document route.

104
00:06:40,790 --> 00:06:43,200
Now that you have your local
dev environment set up,

105
00:06:43,200 --> 00:06:44,670
you're ready to code anywhere.

106
00:06:45,770 --> 00:06:48,360
A laptop might come in handy too.

107
00:06:48,360 --> 00:06:52,230
Remember to check out the notes,
where you'll find a lot more resources and

108
00:06:52,230 --> 00:06:53,740
advanced options.

109
00:06:53,740 --> 00:06:56,480
Until next time,
maybe I'll see you at the beach.