Tech Talk: RegEx (SVG) & JSX: Adapting Vector Graphics for React

Channel:
United States Fullstack Academy
Subscribers:
58,000
Published on ● Video Link: https://www.youtube.com/watch?v=HZcXHNrkZKw


Duration: 11:02
895 views
10

After mocking up a component in a graphics editor, Colten Jackson was about to get to work drawing up the HTML-box-model-layout for a complicated display component for a ReactJS application. But upon opening a text editor, he remembered that the vector graphics editor he used (Inkscape) would export the file as plain XML, and considering the considerable overlap between XML and HTML, he decided to find out what it would take to convert the output of Inkscape (an open source competitor to Adobe Illustrator) into a JSX-friendly react component. With some patience and a few magic spells provided by Vim RegEx, Jackson will demonstrate how Inkscape can be used to design components for React web apps.
----

Fullstack Academy was recently ranked the #1 coding bootcamp in the U.S. Learn more at https://www.fullstackacademy.com.



Other Videos By Fullstack Academy


2016-11-111st-ever "game night" with Fullstack's Remote Immersive students (MMO Minecraft party!)
2016-11-11Recommendation Engines Tutorial: The Basics Behind Various Recommendation Methods
2016-11-11Webpack Tutorial - How to Bundle your Modules with Webpack
2016-11-11Web Audio API Tutorial - Build a Synthesizer and Frequency Analyser using Javascript's Web Audio API
2016-11-11ASI Guide - Rules for Automatic Semicolon Insertion (ASI) in JavaScript
2016-11-11Redis Tutorial - Intro to Redis w/ Node.js Demo
2016-11-11Tech Talk: Machine Intelligence and Political Campaigns
2016-11-11Growth Hacking Techniques - Examples of Growth Hacking Strategies
2016-11-11Introduction to Computer-Aided Diagnosis in Medical Imaging (Radiology)
2016-11-11User Experience (UX) Design Tutorial - Principles and Strategies of UX Design
2016-11-11Tech Talk: RegEx (SVG) & JSX: Adapting Vector Graphics for React
2016-11-11WebGL Tutorial - 3D Rendering in the Web Browser with WebGL
2016-11-11Tails Tutorial: An Overview of Privacy Software and How to Use It
2016-11-11Asynchronous Javascript and Multithreading in C++ Tutorial: The Basics, Pros & Cons, and Examples
2016-11-11RegEx Tutorial - A Tutorial on Regular Expressions and HTML Parsing
2016-11-11Phaser.io Tutorial - Pros and Cons of Phaser and How It Works
2016-11-09How to get hired as a developer and create a "developer story" (Pieter DePree, Stack Overflow)
2016-11-08Fullstack Academy Alumni Stories: From top coding bootcamp to software engineer at Google
2016-11-07Fullstack Live -- Seniors Panel -- 7 Nov 2016
2016-11-07Fullstack Academy Live
2016-11-01Pulse Code Modulation (PCM) Tutorial - How Does PCM Work