DOCSLIB.ORG

Learning React Modern Patterns for Developing React Apps

Total Page：16

File Type：pdf, Size：1020Kb

Download full-text PDF Read full-text
Learning React Modern Patterns for Developing React Apps Second Edition Learning React Modern Patterns for Developing React Apps Alex Banks & Eve Porcello SECOND EDITION Learning React Modern Patterns for Developing React Apps Alex Banks and Eve Porcello Beijing Boston Farnham Sebastopol Tokyo Learning React by Alex Banks and Eve Porcello Copyright © 2020 Alex Banks and Eve Porcello. All rights reserved. Printed in the United States of America. Published by O’Reilly Media, Inc., 1005 Gravenstein Highway North, Sebastopol, CA 95472. O’Reilly books may be purchased for educational, business, or sales promotional use. Online editions are also available for most titles (http://oreilly.com). For more information, contact our corporate/institutional sales department: 800-998-9938 or [email protected]. Acquisitions Editor: Jennifer Pollock Indexer: Judith McConville Development Editor: Angela Rufino Interior Designer: David Futato Production Editor: Kristen Brown Cover Designer: Karen Montgomery Copyeditor: Holly Bauer Forsyth Illustrator: Rebecca Demarest Proofreader: Abby Wheeler May 2017: First Edition June 2020: Second Edition Revision History for the Second Edition 2020-06-12: First Release See http://oreilly.com/catalog/errata.csp?isbn=9781492051725 for release details. The O’Reilly logo is a registered trademark of O’Reilly Media, Inc. Learning React, the cover image, and related trade dress are trademarks of O’Reilly Media, Inc. The views expressed in this work are those of the authors, and do not represent the publisher’s views. While the publisher and the authors have used good faith efforts to ensure that the information and instructions contained in this work are accurate, the publisher and the authors disclaim all responsibility for errors or omissions, including without limitation responsibility for damages resulting from the use of or reliance on this work. Use of the information and instructions contained in this work is at your own risk. If any code samples or other technology this work contains or describes is subject to open source licenses or the intellectual property rights of others, it is your responsibility to ensure that your use thereof complies with such licenses and/or rights. 978-1-492-05172-5 [LSI] Table of Contents Preface. ix 1. Welcome to React. 1 A Strong Foundation 2 React’s Past and Future 2 Learning React: Second Edition Changes 3 Working with the Files 4 File Repository 4 React Developer Tools 4 Installing Node.js 5 2. JavaScript for React. 7 Declaring Variables 8 The const Keyword 8 The let Keyword 9 Template Strings 11 Creating Functions 12 Function Declarations 12 Function Expressions 12 Default Parameters 14 Arrow Functions 14 Compiling JavaScript 17 Objects and Arrays 18 Destructuring Objects 18 Destructuring Arrays 20 Object Literal Enhancement 20 iii The Spread Operator 21 Asynchronous JavaScript 23 Simple Promises with Fetch 24 Async/Await 25 Building Promises 26 Classes 27 ES6 Modules 28 CommonJS 30 3. Functional Programming with JavaScript. 31 What It Means to Be Functional 32 Imperative Versus Declarative 33 Functional Concepts 36 Immutability 36 Pure Functions 38 Data Transformations 40 Higher-Order Functions 47 Recursion 48 Composition 51 Putting It All Together 52 4. How React Works. 57 Page Setup 57 React Elements 58 ReactDOM 61 Children 61 React Components 65 React Components: A Historical Tour 69 5. React with JSX. 71 React Elements as JSX 71 JSX Tips 72 Mapping Arrays with JSX 73 Babel 73 Recipes as JSX 75 React Fragments 82 Intro to webpack 84 Creating the Project 85 Loading the Bundle 94 Source Mapping 94 Create React App 95 iv | Table of Contents 6. React State Management. 97 Building a Star Rating Component 98 The useState Hook 99 Refactoring for Advanced Reusability 104 State in Component Trees 106 Sending State Down a Component Tree 106 Sending Interactions Back up a Component Tree 109 Building Forms 113 Using Refs 114 Controlled Components 115 Creating Custom Hooks 117 Adding Colors to State 119 React Context 120 Placing Colors in Context 122 Retrieving Colors with useContext 123 Stateful Context Providers 125 Custom Hooks with Context 126 7. Enhancing Components with Hooks. 129 Introducing useEffect 129 The Dependency Array 132 Deep Checking Dependencies 136 When to useLayoutEffect 141 Rules to Follow with Hooks 143 Improving Code with useReducer 146 useReducer to Handle Complex State 148 Improving Component Performance 150 shouldComponentUpdate and PureComponent 153 When to Refactor 154 8. Incorporating Data. 155 Requesting Data 155 Sending Data with a Request 157 Uploading Files with fetch 157 Authorized Requests 158 Saving Data Locally 159 Handling Promise States 162 Render Props 165 Virtualized Lists 167 Creating a Fetch Hook 172 Table of Contents | v Creating a Fetch Component 174 Handling Multiple Requests 176 Memozing Values 177 Waterfall Requests 181 Throttling the Network Speed 184 Parallel Requests 185 Waiting for Values 187 Canceling Requests 188 Introducing GraphQL 191 GitHub GraphQL API 191 Making a GraphQL Request 193 9. Suspense. 199 Error Boundaries 201 Code Splitting 205 Introducing: The Suspense Component 207 Using Suspense with Data 208 Throwing Promises 212 Building Suspenseful Data Sources 216 Fiber 220 10. React Testing. 223 ESLint 223 ESLint Plug-Ins 227 Prettier 229 Configuring Prettier by Project 229 Prettier in VSCode 230 Typechecking for React Applications 231 PropTypes 231 Flow 235 TypeScript 238 Test-Driven Development 241 TDD and Learning 241 Incorporating Jest 242 Create React App and Testing 242 Testing React Components 246 Queries 249 Testing Events 250 Using Code Coverage 252 vi | Table of Contents 11. React Router. 255 Incorporating the Router 256 Router Properties 259 Nesting Routes 261 Using Redirects 264 Routing Parameters 265 12. React and the Server. 271 Isomorphic Versus Universal 271 Client and Server Domains 272 Server Rendering React 274 Server Rendering with Next.js 280 Gatsby 285 React in the Future 287 Index. 289 Table of Contents | vii Preface This book is for developers who want to learn the React library while learning the latest techniques currently emerging in the JavaScript language. This is an exciting time to be a JavaScript developer. The ecosystem is exploding with new tools, syntax, and best practices that promise to solve many of our development problems. Our aim with this book is to organize these techniques so you can get to work with React right away. We’ll get into state management, React Router, testing, and server rendering, so we promise not to introduce only the basics and then throw you to the wolves. This book does not assume any knowledge of React at all. We’ll introduce all of React’s basics from scratch. Similarly, we won’t assume that you’ve worked with the latest JavaScript syntax. This will be introduced in Chapter 2 as a foundation for the rest of the chapters. You’ll be better prepared for the contents of the book if you’re comfortable with HTML, CSS, and JavaScript. It’s almost always best to be comfortable with these big three before diving into a JavaScript library. Along the way, check out the GitHub repository. All of the examples are there and will allow you to practice hands-on. Conventions Used in This Book The following typographical conventions are used in this book: Italic Indicates new terms, URLs, email addresses, filenames, and file extensions. Constant width Used for program listings, as well as within paragraphs to refer to program ele‐ ments such as variable or function names, databases, data types, environment variables, statements, and keywords. ix Constant width bold Shows commands or other text that should be typed literally by the user. This element signifies a tip or suggestion. This element signifies a general note. This element indicates a warning or caution. Using Code Examples Supplemental material (code examples, exercises, etc.) is available for download at https://github.com/moonhighway/learning-react. If you have a technical question or a problem using the code examples, please send email to [email protected]. This book is here to help you get your job done. In general, if example code is offered with this book, you may use it in your programs and documentation. You do not need to contact us for permission unless you’re reproducing a significant portion of the code. For example, writing a program that uses several chunks of code from this book does not require permission. Selling or distributing examples from O’Reilly books does require permission. Answering a question by citing this book and quoting example code does not require permission. Incorporating a significant amount of example code from this book into your product’s documentation does require per‐ mission. We appreciate, but generally do not require, attribution. An attribution usually includes the title, author, publisher, and ISBN. For example: “Learning React by Alex Banks and Eve Porcello (O’Reilly). Copyright 2020 Alex Banks and Eve Porcello, 978-1-492-05172-5.” If you feel your use of code examples falls outside fair use or the permission given above, feel free to contact us at [email protected]. x | Preface O’Reilly Online Learning For more than 40 years, O’Reilly Media has provided technol‐ ogy and business training, knowledge, and insight to help companies succeed. Our unique network of experts and innovators share their knowledge and expertise through books, articles, and our online learning platform. O’Reilly’s online learning platform gives you on-demand access to live training courses, in-depth learning paths, interactive coding environments, and a vast collection of text and video from O’Reilly and 200+ other publishers. For more information, visit http://oreilly.com. How to Contact Us Please address comments and questions concerning this book to the publisher: O’Reilly Media, Inc. 1005 Gravenstein Highway North Sebastopol, CA 95472 800-998-9938 (in the United States or Canada) 707-829-0515 (international or local) 707-829-0104 (fax) We have a web page for this book, where we list errata, examples, and any additional information.
Load more

Recommended publications
  • Marketing Cloud Published: August 12, 2021
    Marketing Cloud Published: August 12, 2021 The following are notices required by licensors related to distributed components (mobile applications, desktop applications, or other offline components) applicable to the services branded as ExactTarget or Salesforce Marketing Cloud, but excluding those services currently branded as “Radian6,” “Buddy Media,” “Social.com,” “Social Studio,”“iGoDigital,” “Predictive Intelligence,” “Predictive Email,” “Predictive Web,” “Web & Mobile Analytics,” “Web Personalization,” or successor branding, (the “ET Services”), which are provided by salesforce.com, inc. or its affiliate ExactTarget, Inc. (“salesforce.com”): @formatjs/intl-pluralrules Copyright (c) 2019 FormatJS Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
    [Show full text]
  • Learning React Functional Web Development with React and Redux
    Learning React Functional Web Development with React and Redux Alex Banks and Eve Porcello Beijing Boston Farnham Sebastopol Tokyo Learning React by Alex Banks and Eve Porcello Copyright © 2017 Alex Banks and Eve Porcello. All rights reserved. Printed in the United States of America. Published by O’Reilly Media, Inc., 1005 Gravenstein Highway North, Sebastopol, CA 95472. O’Reilly books may be purchased for educational, business, or sales promotional use. Online editions are also available for most titles (http://oreilly.com/safari). For more information, contact our corporate/insti‐ tutional sales department: 800-998-9938 or [email protected]. Editor: Allyson MacDonald Indexer: WordCo Indexing Services Production Editor: Melanie Yarbrough Interior Designer: David Futato Copyeditor: Colleen Toporek Cover Designer: Karen Montgomery Proofreader: Rachel Head Illustrator: Rebecca Demarest May 2017: First Edition Revision History for the First Edition 2017-04-26: First Release See http://oreilly.com/catalog/errata.csp?isbn=9781491954621 for release details. The O’Reilly logo is a registered trademark of O’Reilly Media, Inc. Learning React, the cover image, and related trade dress are trademarks of O’Reilly Media, Inc. While the publisher and the authors have used good faith efforts to ensure that the information and instructions contained in this work are accurate, the publisher and the authors disclaim all responsibility for errors or omissions, including without limitation responsibility for damages resulting from the use of or reliance on this work. Use of the information and instructions contained in this work is at your own risk. If any code samples or other technology this work contains or describes is subject to open source licenses or the intellectual property rights of others, it is your responsibility to ensure that your use thereof complies with such licenses and/or rights.
    [Show full text]
  • UNIVERSITY of CALIFORNIA SAN DIEGO Simplifying Datacenter Fault
    UNIVERSITY OF CALIFORNIA SAN DIEGO Simplifying datacenter fault detection and localization A dissertation submitted in partial satisfaction of the requirements for the degree of Doctor of Philosophy in Computer Science by Arjun Roy Committee in charge: Alex C. Snoeren, Co-Chair Ken Yocum, Co-Chair George Papen George Porter Stefan Savage Geoff Voelker 2018 Copyright Arjun Roy, 2018 All rights reserved. The Dissertation of Arjun Roy is approved and is acceptable in quality and form for publication on microfilm and electronically: Co-Chair Co-Chair University of California San Diego 2018 iii DEDICATION Dedicated to my grandmother, Bela Sarkar. iv TABLE OF CONTENTS Signature Page . iii Dedication . iv Table of Contents . v List of Figures . viii List of Tables . x Acknowledgements . xi Vita........................................................................ xiii Abstract of the Dissertation . xiv Chapter 1 Introduction . 1 Chapter 2 Datacenters, applications, and failures . 6 2.1 Datacenter applications, networks and faults . 7 2.1.1 Datacenter application patterns . 7 2.1.2 Datacenter networks . 10 2.1.3 Datacenter partial faults . 14 2.2 Partial faults require passive impact monitoring . 17 2.2.1 Multipath hampers server-centric monitoring . 18 2.2.2 Partial faults confuse network-centric monitoring . 19 2.3 Unifying network and server centric monitoring . 21 2.3.1 Load-balanced links mean outliers correspond with partial faults . 22 2.3.2 Centralized network control enables collating viewpoints . 23 Chapter 3 Related work, challenges and a solution . 24 3.1 Fault localization effectiveness criteria . 24 3.2 Existing fault management techniques . 28 3.2.1 Server-centric fault detection . 28 3.2.2 Network-centric fault detection .
    [Show full text]
  • Crawling Code Review Data from Phabricator
    Friedrich-Alexander-Universit¨atErlangen-N¨urnberg Technische Fakult¨at,Department Informatik DUMITRU COTET MASTER THESIS CRAWLING CODE REVIEW DATA FROM PHABRICATOR Submitted on 4 June 2019 Supervisors: Michael Dorner, M. Sc. Prof. Dr. Dirk Riehle, M.B.A. Professur f¨urOpen-Source-Software Department Informatik, Technische Fakult¨at Friedrich-Alexander-Universit¨atErlangen-N¨urnberg Versicherung Ich versichere, dass ich die Arbeit ohne fremde Hilfe und ohne Benutzung anderer als der angegebenen Quellen angefertigt habe und dass die Arbeit in gleicher oder ¨ahnlicherForm noch keiner anderen Pr¨ufungsbeh¨ordevorgelegen hat und von dieser als Teil einer Pr¨ufungsleistung angenommen wurde. Alle Ausf¨uhrungen,die w¨ortlich oder sinngem¨aߨubernommenwurden, sind als solche gekennzeichnet. Nuremberg, 4 June 2019 License This work is licensed under the Creative Commons Attribution 4.0 International license (CC BY 4.0), see https://creativecommons.org/licenses/by/4.0/ Nuremberg, 4 June 2019 i Abstract Modern code review is typically supported by software tools. Researchers use data tracked by these tools to study code review practices. A popular tool in open-source and closed-source projects is Phabricator. However, there is no tool to crawl all the available code review data from Phabricator hosts. In this thesis, we develop a Python crawler named Phabry, for crawling code review data from Phabricator instances using its REST API. The tool produces minimal server and client load, reproducible crawling runs, and stores complete and genuine review data. The new tool is used to crawl the Phabricator instances of the open source projects FreeBSD, KDE and LLVM. The resulting data sets can be used by researchers.
    [Show full text]
  • State of Frontend 2020 Is the Biggest Report out There Focused Solely on Frontend Development
    1 Experts Yan Cui Tim Neutkens AWS Serverless Hero Head of Next.js at Vercel Marek Gajda Guillermo Rauch CTO of The Software House CEO of Vercel Jessica Jordan Tomek Rudzki Developer Advocate at .cult Head of R&D at Onely Luca Mezzalira Dylan Schiemann VP of Architecture at DAZN CEO of Living Spec Rocky Neurock Bartosz Skowroński Engineering Team Lead Head of Design at Honeypot.io at The Software House 2 Authors Patryk Mamczur Editor in Chief Marcin Gajda Joanna Swoboda Tomasz Kajtoch Magdalena Habarta Wiktor Toporek Kamil Głowiński Andrzej Wysoczański Publication Design Technical Consulting 3 Table of contents Developers 8 01 Everyday frontend development according to 4,500 experts Frameworks 12 02 React is king. But who’s the contender? Hosting 18 03 Traditional DCs, cloud giants and frontend-focused hosting Jamstack 24 04 Ecstatic about static Micro frontends 28 05 Do we need microservice revolution in frontend development? Search engine optimization 32 06 It seems that you don’t care about SEO. Here’s why you should Application accessibility 07 Making the interface friendly for every user 36 4 Development teams 40 08 Frontend development? It’s a team sport Design 44 09 Striving for close collaboration between designers and developers Quality assurance 48 10 Software testing as the cornerstone of software development Future of frontend 52 11 State of Frontend 2021? 5 How many frontend developers took part in the survey? Total answers: 4500 1082 Western Europe 941 North America 333 Central and 6 South America 107 Other 1581 Eastern Europe 1082 Western Europe 303 South and East Asia 73 Middle East 7 01.
    [Show full text]
  • Artificial Intelligence for Understanding Large and Complex
    Artificial Intelligence for Understanding Large and Complex Datacenters by Pengfei Zheng Department of Computer Science Duke University Date: Approved: Benjamin C. Lee, Advisor Bruce M. Maggs Jeffrey S. Chase Jun Yang Dissertation submitted in partial fulfillment of the requirements for the degree of Doctor of Philosophy in the Department of Computer Science in the Graduate School of Duke University 2020 Abstract Artificial Intelligence for Understanding Large and Complex Datacenters by Pengfei Zheng Department of Computer Science Duke University Date: Approved: Benjamin C. Lee, Advisor Bruce M. Maggs Jeffrey S. Chase Jun Yang An abstract of a dissertation submitted in partial fulfillment of the requirements for the degree of Doctor of Philosophy in the Department of Computer Science in the Graduate School of Duke University 2020 Copyright © 2020 by Pengfei Zheng All rights reserved except the rights granted by the Creative Commons Attribution-Noncommercial Licence Abstract As the democratization of global-scale web applications and cloud computing, under- standing the performance of a live production datacenter becomes a prerequisite for making strategic decisions related to datacenter design and optimization. Advances in monitoring, tracing, and profiling large, complex systems provide rich datasets and establish a rigorous foundation for performance understanding and reasoning. But the sheer volume and complexity of collected data challenges existing techniques, which rely heavily on human intervention, expert knowledge, and simple statistics. In this dissertation, we address this challenge using artificial intelligence and make the case for two important problems, datacenter performance diagnosis and datacenter workload characterization. The first thrust of this dissertation is the use of statistical causal inference and Bayesian probabilistic model for datacenter straggler diagnosis.
    [Show full text]
  • Unicorn: a System for Searching the Social Graph
    Unicorn: A System for Searching the Social Graph Michael Curtiss, Iain Becker, Tudor Bosman, Sergey Doroshenko, Lucian Grijincu, Tom Jackson, Sandhya Kunnatur, Soren Lassen, Philip Pronin, Sriram Sankar, Guanghao Shen, Gintaras Woss, Chao Yang, Ning Zhang Facebook, Inc. ABSTRACT rative of the evolution of Unicorn's architecture, as well as Unicorn is an online, in-memory social graph-aware index- documentation for the major features and components of ing system designed to search trillions of edges between tens the system. of billions of users and entities on thousands of commodity To the best of our knowledge, no other online graph re- servers. Unicorn is based on standard concepts in informa- trieval system has ever been built with the scale of Unicorn tion retrieval, but it includes features to promote results in terms of both data volume and query volume. The sys- with good social proximity. It also supports queries that re- tem serves tens of billions of nodes and trillions of edges quire multiple round-trips to leaves in order to retrieve ob- at scale while accounting for per-edge privacy, and it must jects that are more than one edge away from source nodes. also support realtime updates for all edges and nodes while Unicorn is designed to answer billions of queries per day at serving billions of daily queries at low latencies. latencies in the hundreds of milliseconds, and it serves as an This paper includes three main contributions: infrastructural building block for Facebook's Graph Search • We describe how we applied common information re- product. In this paper, we describe the data model and trieval architectural concepts to the domain of the so- query language supported by Unicorn.
    [Show full text]
  • The Mobile Phone That Lets You Cheat at ANY Card Game: Handset Has
    2/18/2018 The mobile phone that lets you cheat at ANY card game | Daily Mail Online Feedback Monday, Feb 19th 2018 3AM 47°F 6AM 45°F 5­Day Forecast Home U.K. News Sports U.S. Showbiz Australia Femail Health Science Money Video Travel Columnists DailyMailTV Latest Headlines Science Pictures Coupons Login Ad Hiring a Property Manager? - Now is the Perfect Time Save Yourself A Headache. Find A Local Certied Property Manager Today! VISIT SITE The mobile phone that lets you cheat Site Web Enter your search at ANY card game: Handset has secret sensors to read cards Researcher shares a cheating device that is almost impossible to detect Eli Bursztein purchased what looks like a Samsung smartphone for $1,300 Has a hidden camera and IR LEDs on the side to read each card in the deck Sequences of black spots created by the IR shows the suit and value Everything is then displayed in an app on the device for players to read By STACY LIBERATORE FOR DAILYMAIL.COM PUBLISHED: 17:09 EST, 24 October 2016 | UPDATED: 18:14 EST, 24 October 2016 10 3 shares View comments Counting cards, hand mucking and bottom dealing are all common ways to cheat while playing card games, but are also easily detected. Now, a Google researcher has revealed a gadget that looks and functions like a smartphone - but with software and hardware designed for cheating at cards. An app reads markings on each card with a hidden camera, and can analyse the patterns to determine the card’s suit and value to help the player decide their next move.
    [Show full text]
  • 2.3 Apache Chemistry
    UNIVERSITY OF DUBLIN TRINITY COLLEGE DISSERTATION PRESENTED TO THE UNIVERSITY OF DUBLIN,TRINITY COLLEGE IN PARTIAL FULFILMENT OF THE REQUIREMENTS FOR THE DEGREE OF MAGISTER IN ARTE INGENIARIA Content Interoperability and Open Source Content Management Systems An implementation of the CMIS standard as a PHP library Author: Supervisor: MATTHEW NICHOLSON DAVE LEWIS Submitted to the University of Dublin, Trinity College, May, 2015 Declaration I, Matthew Nicholson, declare that the following dissertation, except where otherwise stated, is entirely my own work; that it has not previously been submitted as an exercise for a degree, either in Trinity College Dublin, or in any other University; and that the library may lend or copy it or any part thereof on request. May 21, 2015 Matthew Nicholson i Summary This paper covers the design, implementation and evaluation of PHP li- brary to aid in use of the Content Management Interoperability Services (CMIS) standard. The standard attempts to provide a language indepen- dent and platform specific mechanisms to better allow content manage- ment systems (CM systems) work together. There is currently no PHP implementation of CMIS server framework available, at least not widely. The name given to the library is Elaphus CMIS. The implementation should remove a barrier for making PHP CM sys- tems CMIS compliant. Aswell testing how language independent the stan- dard is and look into the features of PHP programming language. The technologies that are the focus of this report are: CMIS A standard that attempts to structure the data within a wide range of CM systems and provide standardised API for interacting with this data.
    [Show full text]
  • Andrew Keats
    Andrew Keats Genera Experienc Nationality British Aug 2019 - May 2020 Front-end Team Lead Date of Birth 12 November 1983 Toggle, Led delivery of a greenfield 187 Wardour Street, React-TypeScript SPA trading insight Soho app; complex data-driven UI using D3. Contac London Front-end Architect. In charge of a Telephone 07931998868 W1F 8ZB team of front-end developers; defined Email a [email protected] requirements, managed workloads. Defined best practices and set-up automated linting, unit tests and code Skill & Technologie quality processes. Responsible for CI Client & Front-end Development pipeline in GitLab, using Docker, Web Browser: TypeScript/JavaScript (ES5-2017, OO & NodeJS, and Kubernetes. Functional); Svelte, React, Aurelia, Backbone (SPA frameworks); Ramda, Lo-Dash, jQuery, (utility libraries); CSS, Oct 2018 – Aug 2019 Lead Front-end Developer SASS, PostCSS; HTML5 & Markdown; XML & XSLT. Equal Experts, Delivering a greenfield front-end service Desktop and Mobile: C#; .Net WinForms; Unity. 30 Brock St, for John Lewis, using GCP, Docker, Build tools: Parcel; Rollup; Webpack; Gulp; Grunt; Browserify. Kings Cross, NodeJS, isomorphic React with ES6 Test tools: RTL, Enzyme; Jest, Mocha, Karma, Jasmine; Cypress, London and modular SCSS. YAML driven CI. Selenium, ScalaTest.. NW1 3FG TDD using Jest; ATs using Kotlin and ChromeDriver. Back-end Development Server-side UIs: NodeJS with Polka/Express on GCP/Heroku, Apr 2017 – Sep 2017 Senior Front-end Developer SSR Svelte/React; Use of Scala with the Play framework & Clarksons Platou, Helping to deliver the front-end of a some Java; Experience with MS .Net (2-4), C#, use of DNN Commodity Quay, real-time, global shipping brokerage CMS and Episerver CMS; Experience with the Django St Katharine's & platform using TypeScript, Aurelia, AG framework; Some PHP (Wordpress & Laravel).
    [Show full text]
  • Markus Hatvan, Bsc
    Markus Hatvan, BSc Date of birth: 10th December 1990 Address: St.-Veit-Gasse 20, A-1130 Vienna Nationality: Austria Phone: +436647986649 E-Mail: [email protected] Website: https://markushatvan.com Work experience 1.4.2019 - 30.4.2020 Full Stack Developer at ecosio (Full-time) Tech-Stack: React, Redux, Semantic UI, Storybook, Java Spring, ElasticSearch, MongoDB, Testcafe, Slack, Gitlab, Kibana, Swagger UI 7.1.2019 - 31.3.2019 Frontend Developer at Celum (Full-time) Tech-Stack: Angular, Typescript, RxJS, Material UI, Jasmine, Java Spring, Teams, SVN, Jenkins CI, Swagger UI 1.12.2016 - 31.8.2018 Frontend Developer at Waytation (Full-time) Tech-Stack: Angular, Typescript, RxJS, Bootstrap, SCSS, Google Charts, Protractor, JIRA, Confluence, Gitlab 3.10.2016 - 2.1.2017 Frontend Developer at ChillBill (Internship) Tech-Stack: HAML, SCSS, MeteorJS, React, Middleman, Slack, Github, Waffle.io Projects 26.04.2021 - present Development of website for MediaMarktSaturn Tech-Stack: React, Typescript, GraphQL, Styled Components, Node.js, Contentful CMS, Storybook, Jira, Confluence 16.03.2021 - 31.05.2021 Website Relaunch for Denovo Tech-Stack: React, Gatsby, Typescript, GraphQL, Tailwind UI, Node.js, Contentful CMS, Hubspot API, Usercentrics, Workable API, Google Tag Manager, Heroku, Jira 14.03.2021 - 29.03.2021 Technical writer for DebugBear Writing documentation about Google Web Vitals topics like “Time To Interactive” and “First Input Delay” 01.03.2021 - 10.03.2021 Development of involve.me for involve.me Tech-Stack: VueJS, JQuery, Laravel 01.02.2021
    [Show full text]
  • Developing an Information System Solution with React
    DEVELOPING AN INFORMATION SYSTEM SOLUTION WITH REACT Case: FPT Information System (FIS) LAB UNIVERSITY OF APPLIED SCIENCES LTD Degree programme in Business Information Technology Bachelor’s Thesis Autumn 2020 Viet Linh Vu Abstract Author Type of publication Published VU, VIET LINH Bachelor’s Thesis, UAS Autumn 2020 Number of pages Supervisor 39 Aki Vainio Title of publication Developing an Information System solution with React Case: FPT Information System (FIS) Name of Degree Bachelor of Business Administration, Business Information Technology Abstract The subject of front-end JavaScript frameworks has been a popular topic for discussion within the IT community recently. Over the recent years there has been a numerous number of frameworks released on the market. These frameworks varied in terms of features and performances, and they all offer various options and benefits for front-end development, which can be challenging for new developers to choose the right framework for their project. The research presented in this thesis focused on the React JavaScript library, developed by Facebook. Multiple articles and studies regarding React were used to demonstrate the unique features and the benefits as well as drawbacks of the library. Furthermore, the thesis also covered some additional theory on two other equally popular and frequently used frameworks, Angular and Vue, to provide a comparison of these frameworks. A case study was also used for this research to provide a practical example of how React was implemented for the development of an IT solution. The thesis went through a detailed process of describing the usage of React in this case study to provide an evaluation of how React affected the project development.
    [Show full text]