Code Monkey home page Code Monkey logo

week1's Introduction

Assignment 1

Getting Started

  1. Fork this repository and clone the code to your machine.
  2. Install packages
    npm install
  3. Ensure tests can be run
    npm test
  4. Use node to run any files independently from the test suite. Example: node ./src/timer/runTimer.js.

Overview

  1. The folder src/components contains a file called HTMLElement.js. In this file, create a module that meets the following requirements:

    • Create a class called HTMLElement. This class will be initialized with two arguments: tag and content. Both of these arguments should be stored as instance variables within the class.
    • Once the HTMLElement class is created, add a function to the class called render that can be called publicly. This function should return the HTML element with the content provided.
    • Example usage (you can see the tests for more examples):
    const lovelaceQuote = new HTMLElement('p', 'I am never so happy as when I am really engaged in good earnest...');
    
    console.log(lovelaveQuote.render());
    // prints "<p>I am never so happy as when I am really engaged in good earnest...</p>"
  2. The folder src/components contains a file called DivElement.js. In this file, create a module that meets the following requirements:

    • Create a class called DivElement that extends the HTMLElement class created previously. You'll need to import the class made in step 1.
    • This class should be initialized with one argument: content.
    • This class should inherit the render function in the parent class.
    • Example usage:
    const andIThinkToMyself = new DivElement('What a wonderful world');
    
    console.log(andIThinkToMyself.render());
    // prints "<div>What a wonderful world</div>"
  3. The folder src/timer contains two files called Timer.js and runTimer.js. Perform the following tasks:

    • Examine the code in these two files and determine each script's behavior.
    • Refactor the code to use the ES6 class syntax.
    • Refactor the code to avoid assigning this to a variable.

Submission

  • In order for a valid submission, all tests must pass when running npm test.
  • Create a pull request to this repository and ensure that the CI build succeeds.

Additional Tasks

  1. Review 1-2 other submissions and comment if you have any thoughts or alternatives.
  2. Complete some ES6 Katas. Recommended sections:
    • Promises
    • Arrays
    • Class
    • Destructuring
    • Generators
    • Object literals
    • Strings/template strings
    • Arrow functions
    • Rest/spread operators

week1's People

Contributors

bhague1281 avatar

Watchers

James Cloos avatar Allisa LeBeuf 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.