Build A Responsive Web App Intro

Tue Jul 09 2019

TL/DR: We are going to do a series on building your own dynamic web app. This intro covers the process we will follow and goals and requirements you will need to make this happen for you.

coding design strategy

Table Of Contents

The Good Fellas Agency Build A Responsive Web App Intro

Build Your Own Responsive Web App Intro

Hey everyone, after talking with a few clients about their needs for a dynamic web app, I started thinking about the process of building the web app and how I could help future developers learn to build one on their own. While this is no easy task, I thought it would be a great series, and I am going to break it down into 5 posts to let you have some time to play with and perfect your personal site in between postings. I am going to keep the development requirements free and use some sets I personally use to build sites. So without further ado, let's get this started!

UPDATE: Now that I have finished the series I have linked each of the posts from this main page. I hope that everyone who takes the time to read the 5 posts will learn something and if you get stuck do not hesitate to reach out to us. We would love your feedback in emails if you have time.

GOAL: Build a web app using MEAN stack where you can add your services in a monogDB. Use RESTFUL routing to allow you to update and change your services with authentication and authorization of page access.

REQUIREMENTS: A basic knowledge of JavaScript and nodeJs, HTML5, CSS3 and a few hours a week to work and customize your site for your needs, your computer and internet access

The Steps (and some previews)

  1. Development Environment and setting up your MEAN Stack
    • AWS C9 account and getting started
    • install NPM and Express
    • Get started connecting your app
  2. RESTful Routing and MongoDB
    • What is a RESTful routing
    • Local vs Live
    • Collections- how to define them and how they communicate with your app
  3. Organization and Express Router
    • Cleaning up your main app file
    • What is the Express Router?
    • organizing your file tree
  4. Authentication, Authorization, Connecting MongoDB to Routes, and updating your template files to match
    • Organize your main app file
    • What is the Express Router?
    • Cleaning up your file tree to make it efficient and easy to understand
  5. GIT, Hosting, ENV Variables, and finishing touches
    • GIT and how to use it
    • Hosting and Enviornment Variables
    • Hidden tricks and tips I have learned