Skip to content

Instantly share code, notes, and snippets.

@mrogach2350
Created September 16, 2016 16:07
Show Gist options
  • Save mrogach2350/eb47e9edcf6492504020c9c299d724bb to your computer and use it in GitHub Desktop.
Save mrogach2350/eb47e9edcf6492504020c9c299d724bb to your computer and use it in GitHub Desktop.
# Mikey's guide to making a web app from scratch using Angular.
## Step 1
##Setting up your work space.
### Setup your file structure:
Working in terminal-
```
$ mkdir project_name
$ cd project_name
```
1. Back-end
Once in the appropriate directory, create the basic files every app needs to run the server and database.
```
<!--Make the main server file-->
$ touch server.js
<!--Make the folders to hold the all the other back-end files-->
$ mkdir controllers
$ mkdir models
```
1. Front-end
Next we are going to setup the basic file structure for the front end.
```
<!--Make the folders to hold the front-end files-->
$ mkdir public
$ mkdir views
```
##Step 2
###Getting to the code...
Congratulations, you now have the empty receptical into which we will pour the molten code of your app. It is vital to stay organized. When connecting the front- and back-end, there is a lot of switching between files and a well-maintained file structure can help prevent confusion later on.
For this tutorial, we will follow an "inside -> outside" formula. This approach builds the back-end routes and controllers and then adds the front-end to display the data and allow user input.
Without defining any specific code, back-end setup happens as such.
1. In the server.js file. Define the endpaths for each resource you intend to have on your server/in your database.
2. Each endpath will include the url ending and and the corresponding controller for each action. It is important to label your controllers semantically so it clear to you, as the dev, to be clear with what each element of your code does. This goes back to the earlier principal that organized code is good code.
3.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment