<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Inelastica - Cultura Gráfica! &#187; Tutoriales</title>
	<atom:link href="http://inelastica.com/category/tutoriales/feed/" rel="self" type="application/rss+xml" />
	<link>http://inelastica.com</link>
	<description></description>
	<lastBuildDate>Thu, 11 Feb 2010 00:38:06 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.9.1</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Servidor local para pruebas: http://localhost</title>
		<link>http://inelastica.com/2009/08/localhost/</link>
		<comments>http://inelastica.com/2009/08/localhost/#comments</comments>
		<pubDate>Wed, 26 Aug 2009 15:30:23 +0000</pubDate>
		<dc:creator>Carlos Medrano</dc:creator>
				<category><![CDATA[Tutoriales]]></category>
		<category><![CDATA[127.0.0.1]]></category>
		<category><![CDATA[instalar]]></category>
		<category><![CDATA[localhost]]></category>
		<category><![CDATA[servidor local]]></category>
		<category><![CDATA[windows]]></category>
		<category><![CDATA[xampp]]></category>

		<guid isPermaLink="false">http://inelastica.com/?p=315</guid>
		<description><![CDATA[Todos los que estamos en el Ã¡mbito del desarrollo web, tenemos necesidad de ir viendo lo que vamos haciendo, probando y ajustando algÃºnos pequeÃ±os detalles antes de publicar nuestro proyecto. A pesar que desde el Dreamweaver CS3 ya es bastante facil ir viendo lo que vas haciendo  (WYSIWYG) siempre hay instrucciones de codigo que [...]]]></description>
			<content:encoded><![CDATA[<p>Todos los que estamos en el Ã¡mbito del desarrollo web, tenemos necesidad de ir viendo lo que vamos haciendo, probando y ajustando algÃºnos pequeÃ±os detalles antes de publicar nuestro proyecto. A pesar que desde el Dreamweaver CS3 ya es bastante facil ir viendo lo que vas haciendo  (<a href="http://es.wikipedia.org/wiki/Wysiwyg" target="_blank">WYSIWYG</a>) siempre hay instrucciones de codigo que no muestra de buena manera el area de diseÃ±o de dreamweaver, otra de las soluciones que encontramos es crear en nuestro servidor (si lo tenemos disponible) una carpeta que se llame http://dominio.com/proyectos, v2, etc. Lo cual significa estar subiendo por medio de FTP .</p>
<p style="text-align: center;"><img class="size-full wp-image-317 aligncenter" title="localhostpicture1" src="http://inelastica.com/wp-content/uploads/2009/08/localhostpicture1.png" alt="localhostpicture1" width="423" height="92" /></p>
<p style="text-align: center;">
<p style="text-align: left;">Ahora veremos como instalar en nuestra computadora, un servidor local, para poder hacer pruebas de nuestros proyectos que incluyan scripts de php, bases de datos, etc.</p>
<p><span id="more-315"></span></p>
<p>Para hacer todo este tipo de pruebas vamos a instalar en nuestra propia computadora un servidor local, como el que estÃ¡ instalado en los servidor de internet. En este post lo explicaremos de una forma sencilla para todos aquellos que se enfocan mÃ¡s al diseÃ±o y creatividad en el desarrollo web, que por necesidad siempre tienen que tener esta herramienta a la mano.</p>
<p>Prime explicaremos que es lo que compone bÃ¡sicamente un servidor web (resumido):</p>
<p>1. Servidor http o web (Apache Server, IIS, etc)</p>
<p>2. Servidor de bases de datos (MySql, Sql Server, etc)</p>
<p>3. Servidor ftp (filezilla)</p>
<p>4. Servidor de correo.</p>
<p>porsupuesto los servidores de internet tienen muchas cosas mas instaladas, que no las mencionaremos ahorita. Para este tutorial solamente instalaremos los primeros dos componentes, que son los mas importantes y suficientes para ejecutar nuestras pÃ¡ginas html, php, js, etc. Utilizaremos una programa de software libre que se llama xampp y lo pueden descargar aqui:</p>
<div id="attachment_320" class="wp-caption aligncenter" style="width: 210px"><a href="http://www.apachefriends.org/en/xampp.html" target="_blank"><img class="size-full wp-image-320" title="xampp" src="http://inelastica.com/wp-content/uploads/2009/08/xampp.gif" alt="descargar xampp" width="200" height="59" /></a><p class="wp-caption-text">descargar xampp</p></div>
<p>Para este tutorial instalaremos xampp en una computadora con Windows Vista de 64 bits, Ã©l cual es el mismo proceso para cualquier windows desde XP con SP2. Ahora paraÂ  Mac y Linux de Ãºltimo explicare un par de pasos diferentes que hay que hacer. Con xampp practicamente prepararemos nuestra mÃ¡quina para instalarle lo siguiente:</p>
<p style="text-align: center;">1. Servidor http: Apache Serverd 2.2.12</p>
<p style="text-align: center;">2. Servidor de bases de datos (MySql server)</p>
<p style="text-align: center;">3. y otras cosas como Php, PhpMyAdmin, Webalizer, etc.</p>
<p style="text-align: left;">Bueno, ahora si. Empezemos con el tutorial:</p>
<p style="text-align: left;">1. Damos doble click sobre el archivo ejectuable de xampp (asegurence de haber descargado el archivo .exe)</p>
<p style="text-align: left;">2. Seleccionamos el idioma para la instalacion, english, amenos que sepan Ã¡leman! :D</p>
<p style="text-align: left;">3. Para sistemas de 64 bits nos dara un advertencia. Solamente es que no puede instalar xampp en la carpeta hÃ¡bitual para programas de 32bits (x86), pero ese no es problema lo instalaremos directamente en el disco duro.</p>
<p style="text-align: left;">4. La siguiente ventana nos pregunta en donde queresmos instalarlo, yo lo intalare en:</p>
<blockquote>
<p style="text-align: center;">c:\xampp</p>
</blockquote>
<p style="text-align: left;">5.Â  Luego nos preguntara que servicios inlcuidos dentro de xampp queres instalar, nos saldra una ventana parecida a esta:</p>
<p style="text-align: left;">
<div id="attachment_323" class="wp-caption aligncenter" style="width: 477px"><img class="size-full wp-image-323" title="screenshot_14" src="http://inelastica.com/wp-content/uploads/2009/08/screenshot_14.jpeg" alt="xampp" width="467" height="364" /><p class="wp-caption-text">xampp</p></div>
<p style="text-align: left;">Seleccionamos porsupuesto los ya mensionados:</p>
<ol>
<li>Apache Server</li>
<li>MySql Server</li>
<li>Filezilla Server (este Ãºltimo es opcional, si soalmente eres desarrollador web no lo utilizaras).</li>
</ol>
<p>luego de damos INSTALL y dejamos que el instalador haga su trabajo. Cuando finalize empezara a levantar los servicios.</p>
<p>Si te dice que ha ocurrido un mensaje de error de que el puerto 80 esta en uso, tendras que ver si no tienes instalaciones anteriores de apache server, o programas como Skype instalados en tu computadora.</p>
<p>En el escritorio nos colocÃ³ un icono de xampp le damos doble click para iniciar el control panel y veremos algo como esto:</p>
<p style="text-align: center;"><img class="aligncenter size-full wp-image-324" title="screenshot_15" src="http://inelastica.com/wp-content/uploads/2009/08/screenshot_15.jpeg" alt="screenshot_15" width="454" height="364" /></p>
<p>Nos damos cuenta que nuestros servidores esta instalado correctamente y funcionando.</p>
<p>- Ya instalamos xampp <strong>Ahora probemos nuestro servidor</strong>, escribe en tu browser de eleccion lo siguiente:</p>
<blockquote>
<p style="text-align: center;">http://localhost Ã³ http://127.0.0.1</p>
</blockquote>
<p style="text-align: left;">Si todo salio exitosamente te cargara una pÃ¡gina de bienvenida de apache friends (xampp)</p>
<p style="text-align: left;"><strong>PROBANDO NUESTROS SITIOS</strong></p>
<p style="text-align: left;">Para probar los sitios que hemos hechos, o iniciar uno y poder probarlos con nuestro servidor local debemos tener en cuenta los siguiente:</p>
<p style="text-align: left;">1. Los proyectos deben de estar guardados en la carpeta llamada &#8220;htdocs&#8221; dentro de la carpeta &#8220;xampp&#8221; de instalaciÃ³n.</p>
<p style="text-align: center;"><img class="aligncenter size-medium wp-image-326" title="screenshot_4" src="http://inelastica.com/wp-content/uploads/2009/08/screenshot_4-300x226.jpg" alt="screenshot_4" width="336" height="253" /></p>
<blockquote>
<p style="text-align: center;">C:\xampp\htdocs</p>
</blockquote>
<p style="text-align: left;">Dentro de este directorio crearemos carpetas para guardar nuestros proyectos, para probar crearemos la carpeta &#8220;proyecto1&#8243;</p>
<p style="text-align: center;">C:\xampp\htdocs\proyecto1</p>
<p style="text-align: left;">
<p style="text-align: left;">creemos ahi un archivo llamado index.html con cualquier codigo html y escribamos en el browser:</p>
<p style="text-align: center;">http://localhost/proyecto1</p>
<p style="text-align: left;">
<p style="text-align: left;">Felicidades! ya cargaste tu proyecto como que si estubiera corriendo en un servidor web.</p>
<p style="text-align: left;"><strong>UTILIZAR EL SERVIDOR DE PRUEBA CON DREAMWEAVER</strong> CS4</p>
<p style="text-align: left;">Mucho de nosotros utilizamos dreamweave como herramienta para desarrollar, ahora veremos como configurarlos para que al pulsar &#8220;f12&#8243;, ejectue la pÃ¡gina desde nuestro servidor local.</p>
<p style="text-align: left;">Elegimos en la barra de menÃº:Â  Sites &#8211; Manage Sites y nos abrira un ventana como esta:</p>
<p style="text-align: center;"><img class="aligncenter size-full wp-image-327" title="screenshot_6" src="http://inelastica.com/wp-content/uploads/2009/08/screenshot_6.jpeg" alt="screenshot_6" width="292" height="271" /></p>
<p style="text-align: left;">Le damos New (para agregar un nuevo sito a dreamweaver)</p>
<p style="text-align: left;">En la categoria de Local Info, configuramos los siguientes parametros:</p>
<p style="text-align: left;">(Local root folder: hay que especificar la carpeta en la que se encuentra nuestro proyecto, recuerda que esta debe de estar dentro de nuestro servidor local c:/xampp/htdocs)</p>
<p style="text-align: left;"><img class="aligncenter size-full wp-image-329" title="screenshot_8" src="http://inelastica.com/wp-content/uploads/2009/08/screenshot_8.jpeg" alt="screenshot_8" width="497" height="483" /></p>
<p style="text-align: left;">Luego elegimos la categoria Testing Server</p>
<p style="text-align: left;">y la configuramos de la manera siguiente:</p>
<p style="text-align: left;">- Server model: PHP MySQL</p>
<p style="text-align: left;">- Acces: Local/Network</p>
<p style="text-align: left;">- Testing server folder: c:/xampp/htdocs/proyecto1</p>
<p style="text-align: left;">- url prefix: http://localhost/proyecto1</p>
<p style="text-align: left;"><img class="aligncenter size-full wp-image-330" title="screenshot_9" src="http://inelastica.com/wp-content/uploads/2009/08/screenshot_9.jpeg" alt="screenshot_9" width="504" height="492" /></p>
<p style="text-align: left;">Le damos ok, y ya prodemos ver en Files nuestro archivo index creado anteriormente. lo abrimos y presionamos &#8220;f12 para ejecutarlo y listo! Ya hemos configurado dreamweaver para que prueba la pagina desde nuestro servidor.</p>
<p style="text-align: left;"><img class="aligncenter size-full wp-image-331" title="screenshot_10" src="http://inelastica.com/wp-content/uploads/2009/08/screenshot_10.jpeg" alt="screenshot_10" width="645" height="328" /></p>
<p style="text-align: left;"><img class="aligncenter size-full wp-image-332" title="screenshot_11" src="http://inelastica.com/wp-content/uploads/2009/08/screenshot_11.jpeg" alt="screenshot_11" width="362" height="146" /></p>
<p style="text-align: left;">Espero les ayude este tutorial, esta bien sencillo! de eso se trata, tratare de ir ampliandolo mÃ¡s adelante, cualquier duda, comentario o correciÃ³n por favor postenla.</p>
<p style="text-align: left;">
<p style="text-align: left;">
<p style="text-align: left;">
<p style="text-align: left;">
<p style="text-align: left;">
]]></content:encoded>
			<wfw:commentRss>http://inelastica.com/2009/08/localhost/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Tip: la forma correcta de insertar flash</title>
		<link>http://inelastica.com/2008/08/tip-la-forma-correcta-de-insertar-flash/</link>
		<comments>http://inelastica.com/2008/08/tip-la-forma-correcta-de-insertar-flash/#comments</comments>
		<pubDate>Mon, 11 Aug 2008 22:01:17 +0000</pubDate>
		<dc:creator>rob</dc:creator>
				<category><![CDATA[Tutoriales]]></category>
		<category><![CDATA[Varios]]></category>
		<category><![CDATA[flash]]></category>
		<category><![CDATA[tips]]></category>

		<guid isPermaLink="false">http://inelastica.com/?p=58</guid>
		<description><![CDATA[Para que un archivo flash sea validado, segÃºn la w3
Lo que ya no hay que usar
&#60;embed
src=&#8221;player.swf&#8221;
width=&#8221;300&#8243;
height=&#8221;300&#8243;
allowscriptaccess=&#8221;always&#8221;
allowfullscreen=&#8221;true&#8221;
/&#62;
La forma correcta
&#60;object
type=&#8221;application/x-shockwave-flash&#8221;
data=&#8221;flash.swf&#8221;
width=&#8221;750&#8243; height=&#8221;400&#8243;&#62;
&#60;param name=&#8221;movie&#8221;
value=&#8221;flash.swf&#8221; /&#62;
&#60;/object&#62;
Tomado de nettuts.com
]]></description>
			<content:encoded><![CDATA[<p>Para que un archivo flash sea validado, segÃºn la w3</p>
<p>Lo que ya no hay que usar</p>
<blockquote><p>&lt;embed<br />
src=&#8221;player.swf&#8221;<br />
width=&#8221;300&#8243;<br />
height=&#8221;300&#8243;<br />
allowscriptaccess=&#8221;always&#8221;<br />
allowfullscreen=&#8221;true&#8221;<br />
/&gt;</p></blockquote>
<p>La forma correcta</p>
<blockquote><p>&lt;object<br />
type=&#8221;application/x-shockwave-flash&#8221;<br />
data=&#8221;flash.swf&#8221;<br />
width=&#8221;750&#8243; height=&#8221;400&#8243;&gt;<br />
&lt;param name=&#8221;movie&#8221;<br />
value=&#8221;flash.swf&#8221; /&gt;<br />
&lt;/object&gt;</p></blockquote>
<p>Tomado de <a href="http://nettuts.com/javascript-ajax/quick-tip-insert-flash-the-correct-way/#comment-7120" target="_blank">nettuts.com</a></p>
]]></content:encoded>
			<wfw:commentRss>http://inelastica.com/2008/08/tip-la-forma-correcta-de-insertar-flash/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
	</channel>
</rss>
