JSFiddle - React, Tailwind, and code Playground

HTML

<div id="chart"></div>

CSS

body {
  font: 12px sans-serif;
  margin: 0;
}

.axis path,
.axis line {
  fill: none;
  stroke: #000;
  shape-rendering: crispEdges;
}

.x.axis path {
  display: none;
}

.line {
  fill: none;
  stroke: steelblue;
  stroke-width: 1.5px;
}

JavaScript

var Chart = (function(window, d3) {

    // Declare global variables
    var svg, data, x, y, xAxis, yAxis, dim, chartWrapper, line1, line2, allLines, allPaths, margin = {},
      width, height;

    // Create data
    var data = [{
      date: "1.1.2005",
      serie1: 10,
      serie2: 15
    }, {
      date: "1.2.2005",
      serie1: 14,
      serie2: 16
    }, {
      date: "1.3.2005",
      serie1: 12,
      serie2: 17
    }, {
      date: "1.4.2005",
      serie1: 19,
      serie2: 21
    }, {
      date: "1.5.2005",
      serie1: 7,
      serie2: 13
    }, {
      date: "1.6.2005",
      serie1: 12,
      serie2: 16
    }, ];


    // Define how dates are presented in the source file
    var parseDate = d3.time.format("%d.%m.%Y").parse;

    // Format each series into its own, distinguishable elements
    color = d3.scale.category10();
    color.domain(d3.keys(data[0]).filter(function(key) {
      return key !== "date";
    }));
    lineNames = color.domain().map(function(name) {
      return {
        name: name,
        values: data.map(function(d) {
          return {
            date: d.date,
          };
        })
      };
    });

    //Initialize scales. HACK: only selecting scales based on the 1st series
    xExtent = d3.extent(data, function(d, i) {
      return new Date(parseDate(d.date))
    });
    yExtent = d3.extent(data, function(d, i) {
      return +d.serie1
    });
    x = d3.time.scale().domain(xExtent);
    y = d3.scale.linear().domain(yExtent);

    //Initialize axes
    xAxis = d3.svg.axis().orient('bottom');
    yAxis = d3.svg.axis().orient('left');

    //Initialize svg
    svg = d3.select('#chart').append('svg');
    chartWrapper = svg.append('g');
    chartWrapper.append('g').classed('x axis', true);
    chartWrapper.append('g').classed('y axis', true);


    // Create lines:

    // Version 1: Hardcoded lines
    line1 = d3.svg.line()
      .x(function(d) {
        return x(new Date(parseDate(d.date)))
      })
     ...