How to place components over components in Reactjs-CodePudding

I have a component called </App>, and another component called </Interface>, both are already imported, how can I put Interface on top of App in the centre and export (export default function foo() ) it?

I am new to both React and HTML, so any helps are appreciated!

CodePudding user response：

let me provide some guidance for you here:

1.) It is great that you are learning React, however since you are brand new to web development I strongly urge you to first learn to make a website with vanilla html, vanilla javascript, and css. It will provide you the fundamentals you need to jump into React.

2.) When you are asking about putting Interface on top of App, are you asking about how to make it so that Interface is displayed above App on the page that is rendered, or are you asking how to move it's position in the code? Also, I'm not sure why you have your app component as the source for the image. You should import images from your folder which contains your assets and use that instead.

CodePudding user response：

You can simply import the interface component and use it in the app component. Please follow the provided example.

    export default App= (props) => {
    return
   (
     <Interface/>
  )
  }

Above mentioned would add Interface component to the App Component, similarly you can follow the same pattern to open any other component in the Interface component respectively.