A Docker-based Development Environment Even I Can Understand

50 %
50 %
Information about A Docker-based Development Environment Even I Can Understand

Published on October 25, 2018

Author: JeremyGimbel

Source: slideshare.net

1. A Docker-based Development Environment Even I Can Understand Jeremy Gimbel @dreadfullyposh

2. Obligatory “Who Am I” Slide ● Husband ● Father ● Based in Philadelphia ● Have worked with ExpressionEngine since 2010 ● I was the MojoAddons guy ● Web Services Manager at Vector Media Group

3. The Development Environment Progression

4. The Development Environment Progression 1. Do It Live™

5. The Development Environment Progression 1. Do It Live™ 2. MAMP / Local Servers

6. The Development Environment Progression 1. Do It Live™ 2. MAMP / Local Servers 3. Vagrant (Homestead / Scotchbox / etc.)

7. Docker

8. What is this “Docker” you speak of? Docker is virtual computing platform. The big idea behind it is containerization Creates a virtual host machine on your physical computer Application-specific containers run your web server stack

9. My First Look at Docker Image Machine Docker Compose Registry Services Container Dockerfile Network Swarm

10. How does Docker work?

11. Docker works in Layers Dockerfile Image Built to become an image Container is created from an image Container

12. Ok, it’s not that simple Dockerfile Image Container Dockerfile Dockerfile FROM: debian:jessie-backports apache:latest FROM: debian:jessie FROM: scratch

13. Docker Compose

14. Docker Compose Docker Compose is a tool within Docker that lets you define and run multi-container applications. Applications are defined inside a file called docker- compose.yml. The containers inside an application are called services.

15. Docker Compose Apache PHP-FPM Redis Your Application

16. Learning More

17. Learning More Check out the two Docker for Development series on Servers for Hackers https://serversforhackers.com/t/containers

18. Dash

19. The Fine Print

20. What is Dash Dash is an approach to using Docker and an accompanying shell script, originally written by IFTTT.

21. What is Dash Nginx Proxy MySQL DNSMasq Your Application MailHog Dash Apache PHP-FPM Another Application Nginx PHP-FPM PHPMyAdmin

22. Nginx Proxy? DNSMasq? Oh my!

23. Nginx Proxy? DNSMasq? Oh my! Your Application Apache PHP-FPM Another Application Nginx PHP-FPM Docker Machine Your Local Machine Port 80 Port 443 Port 3306

24. Nginx Proxy? DNSMasq? Oh my! Nginx Proxy MySQL DNSMasq Your Application MailHog Dash Apache PHP-FPM Another Application Nginx PHP-FPM Docker Machine Your Local Machine Port 80 Port 443 Port 3306 PHPMyAdmin

25. How do I set up this wizardry?

26. Setting Up Dash 1. Install Docker (duh) 2. Clone the Dash repo: https://github.com/dreadfullyposh/dash 3. Add your Dash directory to your path

27. Adding Dash to your Path 1. Open Terminal 2.cd ~ <enter> 3.nano .bash_profile <enter> 4. Add a line like this: PATH=$PATH:/path/to/dash <control-x> <y> <enter> 5. Exit Terminal 6.echo $PATH <enter> to confirm your the PATH variable has been updated.

28. Adding Dash to your Path At this point you should be able to type dev <enter> in your terminal window and see a bunch of information display. jeremy@mac ~> dev Execute various commands within the developer environment Usage: dev [options] [COMMAND] [ARGS...]"

29. Setting Up Dash 1. Install Docker (duh) 2. Clone the Dash repo: github.com/dreadfullyposh/dash 3. Add your Dash directory to your path 4. Create a Docker network for your Dash setup by running docker network create dash

30. Setting Up Dash 1. Install Docker (duh) 2. Clone the Dash repo: github.com/dreadfullyposh/dash 3. Add your Dash directory to your path 4. Create a Docker network for your Dash setup by running docker network create dash 5. Configure your Mac to resolve *.test with DNSMasq

31. Configure Resolver 1. Open Terminal 2.cd /etc <enter> 3.mkdir resolver <enter> 4.cd resolver <enter> 5.nano test <enter> 6. type nameserver 127.0.0.1 7. <control-x> <y> <enter> 8. Restart, in honor of our Windows friends

32. Setting Up Dash 1. Install Docker (duh) 2. Clone the Dash repo: github.com/dreadfullyposh/dash 3. Add your Dash directory to your path 4. Create a Docker network for your Dash setup by running docker network create dash 5. Configure your Mac to resolve *.test with DNSMasq 6. Setup SSL

33. Setup SSL 1. Open Terminal 2.cd /your/dash/directory/certs <enter> 3../generatecertificate.sh <enter> 4. Open Keychain Access 5. Drag the .crt file from the certs directory to the Keychain Access window. 6. Double click the certificate 7. Edit the Trust option to Always

34. Start it Up Open Terminal dev dash up <enter> jeremy@mac ~> dev dash up Creating dash_dnsmasq_1 ... done Creating dash_mysql_1 ... done Creating dash_nginx_1 ... done Creating dash_phpmyadmin_1 ... done Creating dash_mailhog_1 ... done

35. But.. what did that do? - Looking at dash.yml version: '3' services: # Nginx Proxy nginx: build: ./docker/nginx ports: - "80:80"

36. Looking at dash.yml - "443:443" volumes: - /var/run/docker.sock:/tmp/docker.sock:ro - ./certs:/etc/nginx/certs restart: always # DNSMasq Server dnsmasq:

37. Looking at dash.yml image: andyshinn/dnsmasq ports: - "127.0.0.1:53:53/tcp" - "127.0.0.1:53:53/udp" cap_add: - NET_ADMIN command: --address=/test/127.0.0.1

38. Looking at dash.yml restart: always # MySQL mysql: image: mysql:5.6 environment: - MYSQL_ROOT_PASSWORD=root

39. Looking at dash.yml volumes: - ./data/mysql:/var/lib/mysql:rw ports: - "3306:3306" restart: always # MailHog mailhog:

40. Looking at dash.yml image: mailhog/mailhog ports: - "1025:1025" expose: - 8025 restart: always

41. Looking at dash.yml depends_on: - nginx environment: VIRTUAL_HOST: mailhog.dev.test VIRTUAL_PORT: 8025 # PHPMyAdmin phpmyadmin: image: phpmyadmin/phpmyadmin

42. Looking at dash.yml expose: - 80 restart: always depends_on: - nginx - mysql environment: VIRTUAL_HOST: phpmyadmin.dev.test PMA_HOST: mysql PMA_USER: root PMA_PASSWORD: root

43. Looking at dash.yml # Configure the Docker network to use networks: default: external: name: dash

44. Setting up a Project

45. Setting Up a Project 1. Copy example/docker-compose.yml to your project directory.

46. Setting Up a Project 1. Copy example/docker-compose.yml to your project directory. 2. Configure docker-compose.yml

47. Configure docker-compose.yml version: '3' services: web: image: webdevops/php-apache:latest ports: - 80 environment: WEB_DOCUMENT_ROOT: /app/public VIRTUAL_HOST: projectname.dev.test HTTPS_METHOD: redirect volumes:

48. Configure docker-compose.yml version: '3' services: web: image: webdevops/php-apache:latest ports: - 80 environment: WEB_DOCUMENT_ROOT: /app/public VIRTUAL_HOST: projectname.dev.test HTTPS_METHOD: redirect volumes:

49. Configure docker-compose.yml version: '3' services: web: image: webdevops/php-apache:latest ports: - 80 environment: WEB_DOCUMENT_ROOT: /app/public VIRTUAL_HOST: projectname.dev.test HTTPS_METHOD: redirect volumes:

50. Configure docker-compose.yml version: '3' services: web: image: webdevops/php-apache:latest ports: - 80 environment: WEB_DOCUMENT_ROOT: /app/public VIRTUAL_HOST: projectname.dev.test HTTPS_METHOD: redirect volumes:

51. Configure docker-compose.yml version: '3' services: web: image: webdevops/php-apache:latest ports: - 80 environment: WEB_DOCUMENT_ROOT: /app/public VIRTUAL_HOST: projectname.dev.test HTTPS_METHOD: redirect volumes:

52. Configure docker-compose.yml volumes: - ./:/app networks: default: external: name: dash

53. Setting Up a Project 1. Copy example/docker-compose.yml to your project directory. 2. Configure docker-compose.yml 3. Start project

54. Start your Project 1. Open Terminal 2.cd /your/project/directory <enter> 3.dev up <enter> jeremy@mac ~> dev up dash_nginx_1 is up-to-date dash_dnsmasq_1 is up-to-date dash_mysql_1 is up-to-date dash_mailhog_1 is up-to-date dash_phpmyadmin_1 is up-to-date Starting projectdir_web_1 ... done

55. Connecting to MySQL Since MySQL is in the Dash, you can’t just connect to it via localhost. From Web Container Host: mysql Username: root Password: root From Local Computer (Sequel Pro) Host: 127.0.0.1 Username: root Password: root

56. Connecting to MailHog With MailHog running, we have a fake SMTP server running so we can monitor any messages sent from our application. From Application SMTP Server: mailhog Port: 1025 Access MailHog From Local Machine Host: https://mailhog.dev.test

57. Connecting to PHPMyAdmin PHPMyAdmin is available in the Dash if you don’t want to use Sequel Pro. Access PHPMyAdmin From Local Machine Host: https://phpmyadmin.dev.test The username and password are already defined, so you should be logged in automatically.

58. That’s it?

59. Gotchas ● Make sure you aren’t running MAMP or some other servers on the same ports: 80, 443, 53 and 3306. ● Make sure you dev down your projects when you’re not using them. The more containers you run, the more of your computer’s resources will be tied up running Docker.

60. Other Useful Tips To shut down a project: dev down To shut down the Dash: dev dash down Make sure to download and install Kitematic, available from the Docker menubar icon. To run a command inside a container in your project: dev exec servicename somecommand

61. Where to Go From Here Now that you’ve got a base setup running, you can extend it by adding more containers. Here are some ideas.

62. Where to Go From Here Need to install Node dependencies? Add a node container. Then run dev run node yarn install node: image: node:8 volumes: - .:/opt working_dir: /opt

63. Where to Go From Here Need to share your development environment with others? Install an ngrok container. ngroktunnel: image: gtriggiano/ngrok-tunnel:development ports: - "4040" environment: NGROK_REGION: us TARGET_HOST: web TARGET_PORT: 80 VIRTUAL_HOST: appname-ngrok.dev.vmg depends_on: - web

64. Wait.. what were those links again? Servers for Hackers Containers Courses https://serversforhackers.com/t/containers Dash Repo on Github https://github.com/dreadfullyposh/dash WebDevOps Docker Images https://hub.docker.com/r/webdevops/ Also, please leave speaker feedback https://eeconf.com/speaker-feedback

Add a comment