Git Product home page Git Product logo

turtlewolfe / chapter07 Goto Github PK

View Code? Open in Web Editor NEW
0.0 0.0 0.0 18 KB

Chapter 7. Introduction to Angular The last piece of the MEAN puzzle is, of course, Angular. Back in 2009, while building their JSON as platform service, developers Miško Hevery and Adam Abrons noticed that the common JavaScript libraries weren't enough. The nature of their rich web applications raised the need for a more structured framework that would reduce redundant work and keep the project code organized. Abandoning their original idea, they decided to focus on the development of their framework, naming it AngularJS and releasing it under an open source license. The idea was to bridge the gap between JavaScript and HTML and help popularize single-page application development. In the years to come, AngularJS—now referred to as Angular—became one of the most popular frameworks in the JavaScript ecosystem, and it completely changed the frontend development world. However, in the past few years, there were a few major paradigm shifts. So, when the Google-sponsored team decided to work on Angular's next version, they introduced a whole set of new ideas. In this chapter, we'll cover the following topics:

JavaScript 66.07% HTML 8.52% TypeScript 25.41%

chapter07's Introduction

Contributors Forks Stargazers Issues MIT License LinkedIn


Table of Contents
  1. About The Project
  2. Getting Started
  3. Usage
  4. Roadmap
  5. Contributing
  6. License
  7. Contact
  8. Acknowledgments

About The Project

Product Name Screen Shot

TurtleWolfe @ ScriptHammer.com

to create from scratch

npx create-react-app . --use-npm
npm i gh-pages --save-dev

or install from this repo

npm i
// to edit package.json
npm init
{
  "name": "project name",
  "scripts": {
    "start": "react-scripts start",
    "deploy": "npm run build && gh-pages -d build",
    "build": "react-scripts build"
  },
  "homepage": "https://UserName.github.io/projectName"
}
// npm run build
npm run deploy
  1. This Episode on Twitch
  2. FreeCodeCamp.com Front End Projects
  3. Markdown Cheatsheet
  4. The Essential Meta Tags for Social Media
  5. GitHub Pages

GitHub Pages Deploy & Domain: TraversyMedia
https://youtu.be/SKXkC4SqtRk

  1. @ScriptHammer on Twitter
  2. LinkedIn

ScriptHammer.com
https://ScriptHammer.com

(back to top)

Built With

(back to top)

Getting Started

This is an example of how you may give instructions on setting up your project locally. To get a local copy up and running follow these simple example steps.

Prerequisites

This is an example of how to list things you need to use the software and how to install them.

  • npm 
    npm install npm@latest -g

Installation

  1. Get a free API Key at https://example.com
  2. Clone the repo 
    git clone https://github.com/TurtleWolfe/turtlewolfe.git
  3. Install NPM packages 
    npm install
  4. Enter your API in config.js 
    const API_KEY = 'ENTER YOUR API';

(back to top)

Usage

Use this space to show useful examples of how a project can be used. Additional screenshots, code examples and demos work well in this space. You may also link to more resources.

For more examples, please refer to the Documentation

(back to top)

Roadmap

  • [] Feature 1
  • [] Feature 2
  • [] Feature 3
    • [] Nested Feature

See the open issues for a full list of proposed features (and known issues).

(back to top)

Contributing

Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.

If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement". Don't forget to give the project a star! Thanks again!

  1. Fork the Project
  2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
  3. Commit your Changes (git commit -m 'Add some AmazingFeature')
  4. Push to the Branch (git push origin feature/AmazingFeature)
  5. Open a Pull Request

(back to top)

License

Distributed under the MIT License. See LICENSE.txt for more information.

(back to top)

Contact

Your Name - @twitter_handle - dev.TurtleWolfe@gmail.co@email_client.com

Project Link: https://github.com/TurtleWolfe/turtlewolfe

(back to top)

Acknowledgments

(back to top)

chapter07's People

Contributors

turtlewolfe avatar

Watchers

avatar

chapter07's Issues

302 Deprecation

npm install

npm WARN deprecated [email protected]: Typings is deprecated in favor of NPM @types
--see README for more information
npm WARN deprecated [email protected]: Please upgrade to 2.2.19 or higher

>[email protected] postinstall C...
>typings install

typings WARN deprecated 11/21/2016: "registry:dt/nodes#6.0.0+20161102143327" is deprecated <updated, replaced or removed>

typings WARN deprecated 5/9/2016: "registry:dt/socket.io-client#1." is deprecated <updated, replaced or removed>

enter image description here

npm install errors for chapter 7

npm start

enter image description here

npm start errors for chapter 7

app\views\index.js

<!DOCTYPE html>
<html>
<head>
	<title><%= title %></title>
	<base href="/">
</head>
<body>
	<mean-app>
		<h1>Loading...</h1>
	</mean-app>
	
	<script type="text/javascript">
		window.user = <%- user || 'null' %>;
	</script>
	
	<script src="lib/core-js/client/shim.min.js"></script>
	<script src="lib/zone.js/dist/zone.js"></script>
	<script src="lib/reflect-metadata/Reflect.js"></script>
	<script src="lib/systemjs/dist/system.js"></script>
	
	<script src="systemjs.config.js"></script>
	<script>
		System.import('app').catch(function(err){ console.error(err); });
	</script>
</body>
</html>

Chapter07 on GitHub

302 deprecations

enter image description here

enter image description here

app\views\index.js

<!DOCTYPE html>
<html>
<head>
	<title><%= title %></title>
	<base href="/">
</head>
<body>
	<mean-app>
		<h1>Loading...</h1>
	</mean-app>
	
	<script type="text/javascript">
		window.user = <%- user || 'null' %>;
	</script>
	
	<script src="lib/core-js/client/shim.min.js"></script>
	<script src="lib/zone.js/dist/zone.js"></script>
	<script src="lib/reflect-metadata/Reflect.js"></script>
	<script src="lib/systemjs/dist/system.js"></script>
	
	<script src="systemjs.config.js"></script>
	<script>
		System.import('app').catch(function(err){ console.error(err); });
	</script>
</body>
</html>

Chapter07 on GitHub

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.