The programming informática es un campo vasto y complejo. Para aquellos interesados en aprender programación y desarrollo web, establecer un camino para aprender toda la información relevante puede parecer estupendamente desalentador.
You will not only need specific equipment such as the best monitor to program que te puedas permitir, así como ratones, teclados y sillas ergonómicas para cuidar tu salud si no que a la vez necesitarás enfocarte en un área particular o programming language, puesto que existen mucha más información de la que puedes dominar si deseas abarcar todo.
Newcomers proclaim many times, "I don't even know where to start!"
This guide is intended to provide direction and help you discover the correct paths to learning web development.
The Circle of Knowledge
Before we begin, let's briefly discuss what I like to call the Knowledge Circle (both known as the generalized way I like to think about acquiring knowledge). Consider the following image:
Para el propósito de este post, supongamos que usted está interesado en aprender a construir su primer sitio web, en el Círculo of Knowledge, the outer edge broadly defines the theme of the Development Web. Inner circles define your level of familiarity with the more specific subtopics of the general topic. These inner circles divide your understanding of the larger topic into three sections: topics you know (or think you know), topics you have heard, and topics you don't even know there are.
Initially, the innermost circle is probably quite small, since you are starting to dig into what you need to learn to know web development. Maybe you know how to turn on a computer; understand that something called browser le posibilita entrar a Internet (que usted sabe que algunas persons a la vez llaman the Web); You can search for topics of interest and go through the search results to determine which one accurately represents the answers to your questions.
It may not sound like much, but this is a great starting point. You already have something in common with the vast majority of computer programmers in the world: if we don't know something, we look for it.
Your first search
Suppose you search for the phrase "how to build a website" and find the following results:
You just populated the middle segment of your Knowledge Circle. Even though you may not understand what they mean, terms like domain, accommodation, Wix and eCommerce is it so now on your radar. Then click on the link How To Build A Website: Beginner's Point-to-Point Guide (2018) and they are welcomed with an additional compilation of terms: WordPress, content management system, HTML, CSS, Drupal, etc.
Before each click, all of these terms were occupying your outermost circle (topics you didn't even know existed), but through the research procedure, one by one you are now moving them to the middle circle - topics you've heard about. This is excellent progress!
The process of learning anything - web development, baking, running for Congress - can be broken down into these steps. Starting with a single search, you will learn a new set of terms, notification patterns (domain and accommodation appeared multiple times in our initial quest), and you will begin to put the puzzle together. The goal of your Circle of Knowledge is hacer crecer el círculo interno -las cosas que usted conoce- tanto como be factible. Para esto, primero existen que ampliar el segmento medio descubriendo nuevos conceptos y después seleccionando aquellos en los que centrar los esfuerzos.
"That's great, but where am I going to go from here?"
Te daré una ventaja: El 100% de todos los sitios web están compuestos de HyperText Markup Language, más fácilmente reconocido por su inicialismo: HTML. Este lenguaje establece la estructura del contents de un sitio web e indica a su navegador las diferencias entre títulos, secciones, párrafos, imágenes, listas con viñetas, listas numeradas, etc. HTML bien estructurado es legible tanto por los browsers como por los dispositivos que ayudan a los usuarios de la web con problemas de visión. Es la base de Internet. A la vez es el lenguaje más importante que puedes aprender a escribir bien al principio de tu carrera de desarrollo web.
Of course, websites are driven by more than well-structured content. Some are beautifully designed. Some have extremely dynamic interactions, and others function as native computer applications. Sometimes you find a site that does it all.
As you learn about HTML, you may find yourself asking some new questions:
- How can I make this look better?
- "Do I just need to create this navigation menu in each file?"
- "Can I save the information that I enter in a form?"
- "Is my profit margin achievable?"
Una vez más, la búsqueda es tu amigo; y al aprovechar tus habilidades de investigación, aprenderás nueva información. Tal vez descubra que el CSS es responsable de la apariencia de un sitio web. Lenguajes como PHP le posibilitan crear plantillas reutilizables para dividir distintas piezas de contenido como la navegación. Los lenguajes de base de datos como MySQL le posibilitan guardar datos de formularios. Al mismo tiempo, escribir marcas semánticas contribuye en gran medida a hacer que su contenido sea alcanzable.
The fork in the road
Comenzarás a ver nuevos caminos de aprendizaje a medida que continúes adquiriendo más conocimiento; y donde existen caminos, existen opciones. Ya sea que le importe más cómo se ve un sitio web y cómo interactúan los usuarios con él, o cómo un sitio web guarda y pone a disposición sus datos, va a informar su decisión de buscar conocimientos específicos en esas áreas. Definimos la apariencia de un sitio web y la recopilación de interfaces de Username como su «frontend», y sus estructuras de datos y lógica de aplicación como su «backend»
Mi amigo y colega, Justin Foell, publicó previamente un post que preguntaba si primero debería aprender JavaScript o PHP. Una pregunta alternativa podría ser: «¿Debería comenzar por aprender a construir interfaces de usuario o sistemas?» Esa es la principal diferencia entre el desarrollo de frontend y backend.
FRONT DEVELOPMENT
The interface of a website comprises the publicly visible content that regular visitors will see. As you have learned, HTML provides the structure for that content, but the responsibility for the visual appearance of that content belongs to Cascading Style Sheets (CSS). At the same time, some behaviors of your site that respond User input, such as activating a slide show or using keyboard commands to activate various settings, is written in a language called JavaScript. Developing a command of HTML, CSS, and JavaScript is important to becoming a frontend web engineer.
Frontend development: templates, presentation styles, animations, user interaction management.
Campaign resources
Una de mis series de libros favoritos para una introducción al desarrollo de frontend es Web design con HTML, CSS, JavaScript y jQuery Set, escrito por Jon Duckett. Estos libros son una maravillosa introducción a cada uno de los tres idiomas principales de la interfaz, y a la vez son hermosos.
For CSS development, CSS Tricks has a great beginner's guide to learning HTML and CSS. Once you have exhausted your collection of those posts, they lay down loads more on the more general frontend development.
A Book Apart typically publishes books on a range of topics from renowned experts in the field. You may be interested in their Front-end Fundamentals series. Soon after, check out both the onResponsive Design series and Front-end Next Steps.
Smashing Magazine is another great general resource for front end development. Smashing publishes tons of posts, tutorials, and books for free, while also offering memberships that provide deep discounts on that content. At the same time they organize several live events throughout the year.
DEVELOPMENT BACKEND
The backend (sometimes called the "server-side") of a site typically consists of:
- a mechanism to save data persistently
- una colección de archivos que un server web entiende
Los datos se pueden almacenar en archivos, pero es más probable que utilice una base de datos en su lugar. El sistema de administración de contenidos de Open Source WordPress usa una combinación de MySQL (lenguaje de base de datos) y PHP (a la vez conocido como Pre-HyperText PHP, un lenguaje del lado del servidor) para generar dinámicamente contenido HTML.
Backend: databases, server-side languages, application logic, application programming interfaces.
If you are interested in learning how to make a dynamic website, then we suggest that you consider learning PHP immediately after learning HTML.
PHP started out as a template language. As such, you can create HTML templates that use PHP to attract your dynamic data. This makes it wonderfully versatile for building your site's structure, since you can separate reusable content like navigation menus into separate files. This way, if that part of your site changes, it can be easily updated wherever that part is used.
Of course, the true power of PHP is in application development. Because it is a backend language, most of your PHP code will not produce templates. Instead, it will be used to connect to data sources such as a database or an application programming interface to retrieve, manipulate, and update that data. Once you learn how to use PHP for templates, introducing a database into the mix and learning how to write queries is the next logical path.
Campaign resources
There are, in my opinion, two definitive resources for learning PHP. First of all, PHP has a glorious online manual that will be your go-to resource whenever you have questions. Second, PHP The Right Way is an online book that covers everything from templates to servers to implementation, so you can focus on an area of the language that is appropriate for your skill level.
Of course, looking for other resources while researching this post, I just learned that Jon Duckett is publishing a new book on server-side development with PHP and MySQL. I don't own this, but knowing how good the frontend series books are, I'm pre-ordering today!
In my opinion, good ones recursos MySQL en línea son un poco más difíciles de obtener, pero sitios como Lynda.com y Laracasts disponen algunos videos instructivos sólidos, si estás dispuesto a pagar por una subscription.
Are you still with me?
Well! That fork in the road is essential, because your initial question, “How do I build a website? Some will be satisfying, and others will find that it is best not to explore them. We leave them there for you to discover.
Previously, I suggested that computer programming contains many more subtopics than anyone could hope to learn. As part of choosing your own path, you must continually ask yourself if the information you are learning is necessary to help you achieve your personal goals. Only you can know for sure.
Continuing down the road
Una vez que dedique suficiente tiempo al aprendizaje de los conceptos básicos del desarrollo de front end o backend, ya no podrá decir que ha oído hablar from their languages. Instead, you can confidently say that you are proficient with them. Congratulations! You have successfully moved one or more topics to the innermost section of your Knowledge Circle: «Topics you know»
However, learning does not stop because you are competent. Throughout the frontend development learning course, you may discover other topics: CSS preprocessors like Sass or LESS, template engines like Twig or Blade, or JavaScript frameworks like React, Vue or Angular. Or, as you learn backend development, you will hear about dependency management using Composer, unit testing with PHPUnit, or development practices like SOLID. Either way, you can find websites that discuss version control, content management applications, responsive design, intrinsic web design, or a concept called "test-driven development."
summarizing
Regardless of your path, bringing knowledge to your inner circle leads to new information, questions, and ways of thinking about a topic. At that point, it is up to you to examine your own competence, level of interests, and the following areas of interest. There are no right or wrong paths. Luckily, there are some people who have made suggested routes public.
An example of this is Kamran Ahmed's "Developer Roadmap - 2018", posted on GitHub. Kamran offers recommended paths for both front-end and back-end development. Their paths are rich in information, but they can seem overwhelming, if it's the first thing you look at. We suggest that you start with the basics outlined above and revisit Kamran's posts once you feel ready to learn more. At the same time, take note of any new terms or information that emerge throughout the learning procedure. How often you see those terms will inform you of what to do next.
Be sure to check in with yourself normally and examine whether or not you are learning about subjects that you like. If so, great! You have discovered topics rich in new information that are right within your areas of interest. If not, it's okay, at the same time. There are some aspects of the field that are less exciting but are still important to know for long-term success. Sometimes a topic is basically not for you. Depending on how far you are on your way, you may find that the road itself it is not correct. Assessing your interest in the information you are learning is very important in guiding your path.
