Git Product home page Git Product logo

thenewboston-responsive-design's Introduction

Responsive Design for thenewboston

This project is for the responsive design for thenewboston website. A preview of the site can be seen here:

http://104.131.1.2/content/account/index.php

Getting Started

First, we need to install and configure XAMPP so that we have a local environment for development.

Step 1

Download and install XAMPP from the official XAMPP website.

  • XAMPP is installed using a simple wizard
  • Keep all of the default settings during installation


Step 2

After XAMPP is installed, open the file C:\xampp\apache\conf\extra\httpd-vhosts.conf


Step 3

Add the following code snippet to the bottom.

  • This tells XAMPP that when we go to tnb-res.com in our browser, take us to this folder
## Custom configuration

NameVirtualHost *:80

<VirtualHost *:80>
    DocumentRoot "C:/xampp/htdocs"
    ServerName localhost
</VirtualHost>

<VirtualHost *:80>
    DocumentRoot "C:/xampp/htdocs/thenewboston-Responsive-Design"
    ServerName tnb-res.com
</VirtualHost>


We will now edit Windows host file so that our computer can recognize our new domain name.

Step 4

Open the file C:\Windows\System32\drivers\etc\hosts


Step 5

Add the following code snippet to the bottom and save the file.

127.0.0.1       localhost
127.0.0.1       tnb-res.com


Step 6

If you are not able to save the file in that folder due to permission settings, first save the file to your Desktop.

  • Make sure that the file type selected is All types (".")

Once saved, drag and replace the file using Windows explorer.


You can now download the source code for the website so that you will have a copy for development.

Step 7

Download GitHub for Windows.

  • GitHub for Windows allows you to easily download and manage your GitHub repositories from your own computer.


Step 8

On the top right of this page click "Fork".

  • This will create a copy of the project to your GitHub account.


Step 9

Open GitHub for Windows and sign in to your GitHub account. Then click the plus button and you will be able to clone the repository for the project.

  • This will download the project to your computer

Make sure to clone the project into your C:\xampp\htdocs\ directory


Step 10

Once all files have been downloaded, open up XAMPP and start Apache and MySQL.

  • When Apache and MySQL are running, your computer will act as a web server and you can host websites locally.


Setup is now complete! You can visit the site by going to: http://tnb-res.com/responsive/content/account/index.php

thenewboston-responsive-design's People

Contributors

buckyroberts avatar abdullahnauman avatar

Watchers

James Cloos avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.