Merging HTML & JavaScript

72
January 01, 2020, at 8:30 PM

I'm editing a section of an open source web-page. It gives logos of companies. This is the main StartupProjects.js file for that particular section: There's also a StartupProjects.css file.

import React from "react";
import "./StartupProjects.css";
import { bigProjects } from "../../portfolio";
export default function StartupProject() {
  function openProjectInNewWindow(url) {
    var win = window.open(url, "_blank");
    win.focus();
  }
  return (
    <div className="main" id="projects">
      <div>
        <h1 className="skills-heading">{bigProjects.title}</h1>
        <p className="subTitle project-subtitle">{bigProjects.subtitle}</p>
        <div className="startup-projects-main">
          <div className="startup-project-text">
            {bigProjects.projects.map(project => {
              return (
                <div className="saaya-health-div" onClick={() => openProjectInNewWindow(project.link)}>
                  <img alt="ME Working" src={project.image}></img>
                </div>
              );
            })}
          </div>
          <div className="starup-project-image"></div>
        </div>
      </div>
    </div>
  );
}

and this is what's imported from another porfolio.js file

const bigProjects = {
  /* Some Big Projects You have worked with your company */
  title: "What I've Been Upto",
  subtitle: "Education",
  projects: [
    {
      image: "https://drive.google.com/uc?VR66eP6RiGAfY",
      link: "http://abaaaac.com/"
    },
    {
      image: "http://themes/nextu/images/og_img.jpg",
      link: "http://xyzhahahnext.se/"
    }
  ]
};

Now, I want to insert a timeline in the same place of this section, under the same heading without disturbing other sections of the webpage. I have written an HTML & CSS code but I can't figure out how to link it here with the javascript file.

For css, I can just edit StartupProjects.css and although there's no file for HTML yet, i can create one but What do I need to keep in the .js file?

READ ALSO
How can I access BrowserView objects in html or css?

How can I access BrowserView objects in html or css?

I'm currently working on an ElectronJS app where I create a browserWindow object using:

75
jquery function to select a button

jquery function to select a button

How to select the clicked button element in function below with jquery?

93
Dynamically adding media queries to the page and overriding the styles from generated html from Application Side

Dynamically adding media queries to the page and overriding the styles from generated html from Application Side

I have code where i dynamically add custom css to my html on the application side like this:

75
Setting src for image inside an li selected using .eq?

Setting src for image inside an li selected using .eq?

I am trying to set the src of of the first image in the first li to the combination of two variables each containing a stringI tried using:

78