Git Product home page Git Product logo

makercollage's Introduction

Collage Maker

A Javascript learning project.

v0.0.2

Goals for this project:

This list is evolving with time...

  • Get better at Javascript
  • Design and build an application that uses images, text and shapes to create pleasing compositions in a collage-like form.
  • Learn how to use XML HTTP Requests to query an external data source, in this case an image API hosted by a 3rd party, and retrieve images based on user keyword input.
    • Take user input and do something useful.
  • Generate SVG shapes randomly.
  • Utilize SVG masking functionality.
  • Use ES 6 modules.
  • Leverage npm in a useful way

Run the application:

  1. Clone the repo,
  2. This project uses SASS, so make sure it is available
  3. Make sure you have a recent version of node (10.14.2)
  4. Run npm install
  5. Then npm run dev

Change Log:

v0.0.2

  • Removed redundant code
  • added a utlils.js file for functions that are widely used or do repetitive tasks
  • fixing up files for better readability and removing commented out code
  • left some commented console log, b/c I'm still a little unclear about functionality, so I might want to return them later

v0.0.1

  • Added a proper README.md
  • update to package.json: running npm start sets up browser sync and starts sass watching as well...
  • added in functionality to generate shapes (mostly triangles using polygon)
  • figured out how to make my xhr function generic and therefore be able to get more than one image at time.

v0.0.0

  • created this project
  • wrestled w/ many of the subjects raised in the goals section
  • dynamic circle generation
  • sorted out how to use the masking functionality in svgs
  • set up browser-sync for development
  • a whole boatload of experiments, falling down rabbit holes, despair, frustration, jubilation, wandering down blind alleys and general good times...

makercollage's People

Contributors

dependabot[bot] avatar ricardoom avatar

Watchers

 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.