Préparer Ubuntu (ou une autre distribution) pour le développement Web

Au-delà des mythes, des croyances ou de l'opinion selon laquelle GNU / Linux est compliqué à utiliser, je le considère comme un excellent système d'exploitation pour ceux qui sont des développeurs, en particulier développeurs web.

J'ai eu l'occasion de converser avec de nombreuses personnes qui préfèrent OS X et même Windows à développer, comme on dit, en raison de sa facilité et de ses outils, et bien que ce soit une opinion très individuelle de chacun, je crois que toute distribution GNU / Linux ou du moins les plus populaires, offre tout ce dont vous avez besoin pour installer et travail.

[quote] Les distributions les plus populaires offrent tous les packages nécessaires dans leurs référentiels pour un développeur Web. [/ quote]

Maintenant, sur la question du développement, il y a un dilemme, est une distribution très mise à jour comme Antergos ou celui qui maintient un équilibre entre stable et à jour comme Ubuntu?

Je donne un exemple très simple, alors que dans Ubuntu fidèle la dernière version de Netbeans est 7.0.1, dans ArchLinux la version 8.0.2 est disponible. La même chose se produit avec NodeJS et d'autres packages que nous verrons ci-dessous qui sont largement utilisés par L'extrémité avant.

Quoi qu'il en soit, c'est à chacun de décider de choisir la répartition de ses préférences en fonction des travaux à réaliser. Pour cet article, nous partirons d'une installation Ubuntu, et comme il est axé sur les nouveaux utilisateurs, nous montrerons le processus étape par étape.

Installez Ubuntu 14.04

La première chose que nous allons faire est de télécharger l'image d'installation d'Ubuntu depuis son site officiel. Le lien ci-dessous vous permettra de choisir de télécharger une iso 32 bits ou 64 bits.

Télécharger Ubuntu

Une fois que nous l'avons téléchargé, nous devons "graver" un DVD avec l'iso téléchargé ou préparer une mémoire Flash pour démarrer et installer à partir de celui-ci. Sous Windows, nous pouvons le faire en suivant ce guide et sur Mac Cet autre. Une fois cela fait, nous redémarrons le PC et commençons par la mémoire ou le DVD.

Étapes d'installation d'Ubuntu 14.04

Si vous ne savez pas comment installer Ubuntu sans perdre vos données, vous pouvez l'installer à l'aide d'une machine virtuelle dans VirtualBox ou sauvegarder toutes vos données dans un endroit sûr, si possible, sur un disque externe

La première chose à faire est de sélectionner la langue avec laquelle nous voulons installer Ubuntu:

Développeurs Ubuntu

Plus tard, nous verrons si nous avons toutes les exigences nécessaires pour l'installation:

Ubuntu_Development2

Plus tard, nous allons partitionner le disque dur. Si vous n'avez pas d'expérience avec cela, il est préférable de tout laisser par défaut une fois que vous avez sauvegardé vos données.

Ubuntu_Development3

Nous choisissons le fuseau horaire:

Ubuntu_Development4

Nous choisissons la langue de notre clavier:

Ubuntu_Development5

Nous définissons notre nom d'utilisateur, le nom de notre ordinateur, notre mot de passe:

Ubuntu_Development6

Et nous attendons que cela se termine:

Ubuntu_Development7

Une fois le programme d'installation terminé, nous redémarrons l'ordinateur et entrons dans notre session. Nous pouvons exécuter le gestionnaire de mise à jour ou ouvrir un terminal et mettre:

$ sudo apt update && sudo apt upgrade

Et s'il n'y a rien à mettre à jour, nous pouvons commencer.

Préparer notre espace de travail pour les tests

Donc, comme nous sommes des développeurs, nous voulons nous concentrer uniquement sur ce que nous savons faire: desarrollar. Nous ne sommes pas intéressés de savoir comment configurer un serveur Web, ou comment fonctionne une base de données, nous voulons juste quelque chose qui fonctionne et soit facile à implémenter pour commencer à écrire du code.

Si nous devions seulement écrire en HTML, CSS, JS, tout serait plus simple, mais parfois nous devons avoir un serveur de test pour le code en PHP, Ruby, DJango, etc. Par conséquent, il est préférable de configurer notre propre serveur Web. Heureusement pour nous, nous avons cette installation de deux manières différentes:

  1. Utilisation de l'installateur XAMPP ce qui nous fournit Apache.
  2. Utilisation LAMPE Bitnami.

Installer Bitnami

L'installation de LAMP via Bitnami nous l'avons déjà vu dans un article précédent, il ne sera donc pas nécessaire de l'aborder dans cet article. Une fois Bitnami installé, nous pouvons gérer notre serveur de test via le navigateur Web.

Bitnami

Toute la documentation nécessaire sur le fonctionnement de Bitnami est disponible sur son wiki.

Installation de XAMPP

Le programme d'installation de XAMPP provient également de Bitnami, mais le processus d'installation est un peu différent, nous allons donc le parcourir étape par étape. La première chose bien sûr est de télécharger le fichier qui nous intéresse selon l'architecture de notre processeur:

XAMPP 32 bits
XAMPP 64 bits

Une fois téléchargé, nous ouvrons un terminal et accédons au dossier où se trouve le fichier, auquel nous donnerons des autorisations d'exécution. Dans le cas du fichier 64 bits, ce serait:

$ sudo chmod a+x xampp-linux-x64-5.5.19-0-installer.run

Maintenant, dans le même terminal, nous l'exécutons:

$ sudo ./xampp-linux-x64-5.5.19-0-installer.run

Et nous suivons les étapes suivantes.

Il est conseillé d'accepter tout tel qu'il vient par défaut, pour cela il suffit de donner le Entrer

XAMPP

Dans l'image précédente, il nous a demandé si nous voulions installer les fichiers pour les développeurs et dans la dernière, si nous sommes d'accord avec la sélection que nous avons choisie.

xampp1

Maintenant, il nous demande le chemin où nous voulons installer (par défaut, il est dans / opt / lampp), et bien que nous puissions le changer, je recommande de le laisser tel quel.

xampp2

Encore une étape de vérification avant de commencer l'installation

xampp3

Installation de XAMPP

xampp5

Installation terminée.

xampp6

Maintenant, pour démarrer XAMPP, il suffit d'exécuter:

$ sudo / opt / lampp / lampp start Démarrage de XAMPP pour Linux 5.5.19-0 ... XAMPP: Démarrage d'Apache ... ok. XAMPP: Démarrage de MySQL ... ok. XAMPP: Démarrage de ProFTPD ... ok.

Et de cette façon, nous avons déjà notre serveur Apache + MySQL + PHP + Perl en cours d'exécution. Si vous avez un problème, je vous recommande de visiter la FAQ.

DNS personnalisé et hôte virtuel avec XAMPP

En supposant que nous ayons plusieurs sites hébergés sur notre serveur de test, nous pouvons définir chacun d'eux pour qu'il soit affiché localement dans le fichier / Etc / hosts. Prenons un exemple, disons que nous avons le site dev.tests.com, ce que nous faisons, c'est ouvrir le fichier / Etc / hosts avec notre éditeur de texte préféré (et en tant que root) et ajoutez-le comme suit:

$ sudo vim /etc/hosts

et nous ajoutons la ligne:

127.0.0.1   dev.prueba.com

Mais bien sûr, cela ne suffit pas, car nous devons dire à Apache que lorsque quelqu'un fait une demande à dev.test.com Pour 127.0.0.1, vous devez retourner notre site de test.

Nous éditons le fichier /opt/lampp/etc/httpd.conf

$ sudo vim /opt/lampp/etc/httpd.conf

et décommentez (en supprimant le signe dièse) la ligne qui dit:

# Include etc/extra/httpd-vhosts.conf

et nous le laissons comme ceci:

Include etc/extra/httpd-vhosts.conf

Maintenant, nous allons au fichier /opt/lampp/etc/extra/httpd-vhosts.conf qui devrait avoir quelque chose comme ceci:

# n'utilisez que des hôtes virtuels basés sur les noms pour que le serveur n'ait pas à se soucier des # adresses IP. Ceci est indiqué par les astérisques dans les directives ci-dessous. # # Veuillez consulter la documentation à # # pour plus de détails avant d'essayer de configurer des hôtes virtuels. # # Vous pouvez utiliser l'option de ligne de commande '-S' pour vérifier la configuration de votre # hôte virtuel. # # Exemple VirtualHost: # Presque toutes les directives Apache peuvent entrer dans un conteneur VirtualHost. # La première section VirtualHost est utilisée pour toutes les requêtes qui ne correspondent à # ServerName ou ServerAlias ​​dans aucun bloc. # ServerAdmin webmaster@dummy-host.example.com DocumentRoot "/opt/lampp/docs/dummy-host.example.com" ServerName dummy-host.example.com ServerAlias ​​www.dummy-host.example.com ErrorLog "logs / dummy -host.example.com-error_log "CustomLog" logs / dummy-host.example.com-access_log "commun ServerAdmin webmaster@dummy-host2.4.example.com DocumentRoot "/opt/lampp/docs/dummy-host80.example.com" ServerName dummy-host80.example.com ErrorLog "logs / dummy-host2.example.com-error_log" CustomLog "logs / dummy-host2.example.com-access_log" commun

Nous le modifions et le laissons ainsi:

# n'utilisez que des hôtes virtuels basés sur les noms pour que le serveur n'ait pas à se soucier des # adresses IP. Ceci est indiqué par les astérisques dans les directives ci-dessous. # # Veuillez consulter la documentation à # # pour plus de détails avant d'essayer de configurer des hôtes virtuels. # # Vous pouvez utiliser l'option de ligne de commande '-S' pour vérifier la configuration de votre # hôte virtuel. # # Exemple VirtualHost: # Presque toutes les directives Apache peuvent entrer dans un conteneur VirtualHost. # La première section VirtualHost est utilisée pour toutes les requêtes qui ne correspondent à # ServerName ou ServerAlias ​​dans aucun bloc. # DocumentRoot "/ home / chemin / dossier / projet /" ServerName mon_blog.dev Exiger tout accordé

Évidemment, le chemin vers notre dossier de projet doit être spécifié lors du remplacement "/ Accueil / chemin / dossier / projet /".

Installation manuelle de la lampe

Maintenant, même si cela ne semble pas être le cas, je pense qu'il est plus fastidieux de faire l'installation de la manière précédente que d'installer les packages directement à partir de nos référentiels. Pour avoir le même Stack sur notre PC, il suffit d'ouvrir un terminal et de mettre:

$ sudo apt install apache2 mysql-server-5.5 phpmyadmin

Avec ces 3 packages uniquement, les dépendances nécessaires seront installées pour commencer à travailler avec le minimum requis lors du développement.

DNS personnalisé et hôte virtuel avec LAMP

Du côté du DNS (Domain Name Server) nous gardons tout pareil, c'est-à-dire que nous ajoutons les noms de nos sites de test dans le fichier / Etc / hosts. Or, dans le cas d'Apache, le chemin du VHost (Virtual Hosts) est différent.

Normalement, ce qui est fait est de placer ce que nous mettons dans le fichier /opt/lampp/etc/extra/httpd-vhosts.conf sur la route /etc/apache2/sites-available/vhostname.conf, puis un lien symbolique est établi vers ce fichier dans le dossier / etc / apache2 / sites-enabled / mais nous n'allons pas compliquer. Nous mettrons directement le fichier dans / etc / apache2 / sites-enabled / avec la configuration suivante:

$ sudo vim /etc/apache2/sites-enabled/dev.prnza.com.conf DocumentRoot "/ home / chemin / dossier / projet /" ServerName mon_blog.dev Exiger tout accordé

Je pense qu'il est valable de préciser que lorsque nous installons manuellement, le chemin par défaut des dossiers du site Web est / var / www / http /.

Installation de NodeJS et Ruby

Si on utilise NodeJS o Rubi (au lieu de PHP et Perl), nous pouvons installer manuellement les packages en exécutant dans la console:

$ sudo apt install nodejs ruby

Et s'ils ont besoin de plus de packages, il leur suffit de le rechercher en exécutant le gestionnaire de packages ou dans la console:

$ sudo apt search paquete a buscar

Jusqu'à cette partie, nous avons déjà la partie côté serveur prête pour notre sandbox, voyons maintenant certaines des applications que nous pouvons utiliser.

Outils de développement Web

Dans les référentiels, nous avons des applications qui nous permettront de travailler confortablement en matière de HTML, CSS, JS et autres. Parmi eux, nous avons:

  • Bluefish
  • Geany
  • Gedit
  • Kate

Être Poisson Bleu (à mon avis) le plus complet quand il s'agit de travailler L'extrémité avant, mais je recommande d'installer des applications tierces qui nous offrent beaucoup plus de fonctionnalités. Nous avons par exemple Supports, SublimeTexte o Komodo-Modifier. Toutes ces applications ont leur propre package d'installation pour Ubuntu, à l'exception de Komodo-Edit, qui n'a qu'à être décompressé et un fichier .sh exécuté.

(… en procès …)


32 commentaires, laissez le vôtre

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont marqués avec *

*

*

  1. Responsable des données: Miguel Ángel Gatón
  2. Finalité des données: Contrôle du SPAM, gestion des commentaires.
  3. Légitimation: votre consentement
  4. Communication des données: Les données ne seront pas communiquées à des tiers sauf obligation légale.
  5. Stockage des données: base de données hébergée par Occentus Networks (EU)
  6. Droits: à tout moment, vous pouvez limiter, récupérer et supprimer vos informations.

  1.   chasseur dit

    Quelqu'un d'autre voit-il une chauve-souris fantôme dans l'image de la chèvre de cette version d'ubuntu?

    1.    animé dit

      Hahaha c'est vrai ... en regardant seulement la barbe orange et les creux du museau 😀

    2.    Ivan Barra dit

      Maintenant que vous en parlez… ça s'appelle «Pareidolia».

      Quant à savoir quels Distros choisir lors de la programmation, c'est assez compliqué. "Auparavant", il a été développé pour quelques navigateurs et le tour est joué, car le développement était beaucoup plus lent. Aujourd'hui, il existe une infinité de navigateurs et de plateformes sur lesquels développer des applications WEB, appelez cela ASP.Net, PHP, JAVA, etc. là où les applications sont beaucoup plus transversales, je veux dire par là qu'elles ne sont pas seulement accessibles à partir d'ordinateurs de bureau ou portables typiques, mais qu'elles sont déjà effectuées (et la même fonctionnalité est souhaitée) à partir d'une tablette, d'un mobile, etc.

      Je crois qu'aujourd'hui il faut rester à la pointe, en sauvegardant tout d'abord la stabilité et la sécurité des applications, en ce sens je suis paranoïaque, ça me coûte encore beaucoup de réaliser, par exemple, une transaction bancaire depuis le autre appareil qui n'est pas le mien, j'espère souvent me rendre en sécurité chez moi pour le faire, même si cela semble illogique.

      L'autre. Soyons honnêtes: il est bien connu que la plupart des programmeurs (du moins ceux que je connais), qu'ils soient web, JAVA, BB.DD, etc., au moins 80% utilisent une plateforme Unix pour programmer. Les gens qui sans tous les outils proposés sur la plateforme, ouvertement et gratuitement, seraient très compliqués pour aller de l'avant. En outre, je peux dire avec certitude que presque toute la plate-forme WEB, ou BB.DD. il est monté sur un serveur Unix, donc, ne serait-il pas logique que l'autre partie fonctionne de la même manière?

      Merci pour le partage et les salutations.

    3.    Batman dit

      Tais-toi… je suis Batman!

    4.    neysonv dit

      On dirait un hibou pour moi lol

      1.    animé dit

        C'est vrai ... ici on pense la même chose après avoir regardé

  2.   Hugo Santos dit

    Je suis un développeur web principalement PHP, j'utilise Debian comme environnement de travail depuis plusieurs années, comme mentionné dans l'article, la décision de quelle distribution utiliser dépend de chaque personne, et dans le domaine de développement Linux si elle fournit un grand nombre d'outils qui facilitent la vie.

    Juste à titre de commentaire, j'ai vu dans de nombreux endroits que certains développeurs installent XAMPP, LAMP et / ou similaire, sous Linux, il n'est pas nécessaire de le faire car nous nous souvenons qu'apache est natif de linux, par exemple je n'installe qu'apache2 et php5 sur mon Debian avec le typique (aptitude install apache2 php5) et voila, je n'ai plus rien d'autre à faire que de mettre mes projets dans / var / www

    1.    animé dit

      C'est vrai, ce qui se passe, j'ai essayé de le faire "facile", bien que dans le post je mentionne les deux méthodes 😉

    2.    Automatisation Tecno-Integra dit

      Salutations. Cela me semble bien que vous installiez apache2 et php5, mais je pense que vous auriez besoin de mettre mysql et comment configurer phpmyadmin? Merci.

  3.   Marcos_tux dit

    Soyons honnêtes, malgré l'effort que Dreamweaver fait passer tous ces programmes, c'est dommage mais sous Linux nous n'avons pas quelque chose à la hauteur de ce programme Adobe.

    1.    éliotime3000 dit

      Oui il y en a (enfin, en partie), ça s'appelle Brackets et il considère aussi Vim et Emacs. : v

    2.    Cette benne appelée Dreamweaver dit

      Bien sûr, mettre des déchets dans le code Dreamweaver passe à côté de tout le monde

    3.    Hernán dit

      Dreamweaver est plus pour les concepteurs que pour les programmeurs, pour les personnes qui travaillent avec du code, il est trop lourd et lent. Il est beaucoup plus confortable d'utiliser un programme comme du texte sublime, des crochets ou webStorm / phpStorm. Les fois où j'ai utilisé Dreamweaver j'ai eu des problèmes, après avoir laissé mon code prêt, je suis passé en mode conception, où si je mets un point ou déplace quelque chose, Dreamweaver se charge de démonter complètement mon code qui était si soigné. Pour ne pas dire que c'est un paiement. J'ai des amis designers et pour eux c'est fantastique, car ils peuvent créer une page sans écrire une seule ligne de code.

      1.    Eduardo dit

        breamweaver Hahaha je n'apprendrai jamais avec ça si tu apprends à couper

    4.    KZKG ^ Gaara dit

      Dreamwho?… Baff, mon pote, Artisteer, Dreamweaver, tout cela est de la pure connerie, désolé de le dire mais c'est la vérité.

      Ils mettent sept cents lignes de code poubelle, beaucoup de balises ou d'objectifs qui ne sont pas nécessaires, etc. etc.

      Brackets, Sublime, avec l'un d'entre eux est plus que suffisant pour faire n'importe quel travail CSS.

    5.    kdexneo dit

      Aptana Studio 3 bien meilleur que Dreamweaver.

    6.    animé dit

      Qu'a-t-il dit? Dreamweaver? Et thatooo queee essss?

    7.    sherpa90 dit

      J'espère que vous voyez tout le code poubelle qui vous génère ... dreamweaver est pour les NON-PROFESSIONNELS, point final!

  4.   hazama dit

    Post sensationnel, vraiment
    Félicitations

    1.    animé dit

      Merci 😉

  5.   Petercheco dit

    Votre info est très utile… Merci. Revenez-vous aux eaux Ubuntu / Debian?

    1.    KZKG ^ Gaara dit

      HAHA il garde toujours un espace dans son cœur pour Debian, mais ... Ubuntu je ne pense pas si hehehe

      1.    Petercheco dit

        On ne sait jamais 😀 😀

    2.    animé dit

      Bien que cela ne doive jamais être dit JAMAIS, je ne pense vraiment pas que je retournerai à Debian pendant très, très, très longtemps.

  6.   Celsius dit

    Pauvre matou, personne n'en veut.

    1.    animé dit

      Qui veut Java? 😛

  7.   Gabriel dit

    Je pense que les thèmes se confondent (encore une fois), il y a vous qui n'êtes que des designers, d'autres qui ne sont que des programmeurs, il y a les deux, il y a ceux qui voient winbug "facile" parce qu'ils installent ensuite ensuite et "tout est prêt" (ce qui implique qu'ils peuvent ou non travailler avec des logiciels propriétaires et / ou sous licence), il y a ceux qui sont un peu plus avancés (et "courageux") et connaissent également Linux et travaillent normalement avec les outils qu'ils trouvent entre les deux, et donc un long etc, comme nous partageons dans ce blog l'idée est que l'on développe sur gnu-línux quelle que soit la distribution et donc que des outils open source sont utilisés, le problème sous-jacent (je pense) est que cela dépend de chaque personne, il y a outils On ne sait même pas mais quand on veut apprendre on doit investir quelques heures jusqu'à ce qu'on le donne, et si on se sent à l'aise (peu importe ce que les autres pensent) on sera heureux !! (:

    1.    rlsalgueiro dit

      vous pouvez également télécharger la version pour php5.6.3
      http://downloads.sourceforge.net/project/xampp/XAMPP%20Linux/5.6.3/xampp-linux-x64-5.6.3-0-installer.run
      http://downloads.sourceforge.net/project/xampp/XAMPP%20Linux/5.6.3/xampp-linux-5.6.3-0-installer.run
      Cela dépend de ce que vous développez ou de la compatibilité dont vous avez besoin, pour conserver la version 5.5, j'installe simplement les paquets qui sont dans le repo et c'est tout, j'ai apache 2.4, php5.5.13 etc. aussi les autres bibliothèques comme phpcs sont faciles à utiliser installer, il est clair que j'aime le shell et je préfère installer et configurer tout ce que je peux.

      1.    rlsalgueiro dit

        Vous avez vu ce projet wpn-xm.org, il serait intéressant de réaliser quelque chose comme ça pour linux, je dis intégré car j'utilise certains de ces outils, et je suis désolé de dire que malgré son grand nombre de librairies et que le les hébergements sont presque tous montés sur Apache que j'ai changé pour nginx. J'ai trouvé wpn-xm à la recherche d'alternatives à LAMP et XAMPP et c'est bon pour la machine de travail, c'est sans aucun doute une bonne alternative. au fait désolé pour mon commentaire précédent sur W $ + chrome

  8.   Raul casari dit

    Votre contribution est très intéressante, continuez à la développer, elle est appréciée

  9.   Michel Cardoza dit

    Bonjour je suis nouveau sur Ubuntu, j'ai toujours utilisé windows mais je souhaite migrer vers un environnement linux en utilisant Ubuntu mais quand je veux créer des dossiers ou mettre des fichiers dans les htdocs comme dans windows cela ne me permet pas ou il y a certaines choses que par personnalisé dans Windows je pourrais le faire mais dans Ubuntu je ne peux pas le faire bloquer beaucoup ou cela ne me permet pas d'apporter des modifications, si j'utilise sublime pour créer des fichiers dans htdocs, cela ne me permet pas non plus, si vous peut m'aider, je l'apprécierais.

  10.   Mont dit

    Quelqu'un peut-il m'aider?
    Il y a plusieurs années, j'ai suivi un petit cours de conception Web et j'ai adoré, et bien qu'ils m'aient donné les programmes pour Windows, ils ne m'ont jamais laissé les installer.
    Il y a quelques mois, j'ai enfin pu passer à Linux Ubuntu et je ne trouve aucun programme
    Je me souviens que dans le cours, j'ai vu trois programmes
    Dreamweaver, Flash MX et un autre destiné à la retouche de photos mais je ne me souviens plus du nom.
    Pouvez-vous indiquer des sites de téléchargement ou des itinéraires pour installer l'équivalent de ce que j'ai vu dans le cours?
    salutations
    Merci.