21ebu
Hectopat
- Katılım
- 8 Kasım 2021
- Mesajlar
- 259
Daha fazla
- Cinsiyet
- Erkek
Merhaba, React ile Tayfun Erbilen'in kod editörü dersini izleyerek yapmaya çalışıyorum ama bende HTML, CSS, JS kısımlarında tam birine tıklayınca hata veriyor sebebi nedir? ChatGPT de çözemedi.
Ders:
CodeBar.js
App.js
Hata
ile çözdüm.
Ders:
CodeBar.js
Kod:
import styles from 'components/CodeBar.module.css';
import { useState } from 'react';
import CSSEditor from './Editor/CssEditor';
import JSEditor from './Editor/JsEditor';
import HtmlEditor from './Editor/HtmlEditor';
function CodeBar() {
const [activeTab, setActiveTab] = useState('html');
return (
<aside className={styles.codebar}>
<nav className={styles.tab}>
<button onClick={() => setActiveTab('html')} className={`${styles.item} ${activeTab === 'html' && styles.activeTab}`}>HTML</button>
<button onClick={() => setActiveTab('css')} className={`${styles.item} ${activeTab === 'css' && styles.activeTab}`}>CSS</button>
<button onClick={() => setActiveTab('js')} className={`${styles.item} ${activeTab === 'js' && styles.activeTab}`}>JS</button>
</nav>
{activeTab === 'html' && <HtmlEditor />}
{activeTab === 'css' && <CSSEditor />}
{activeTab === 'js' && <JSEditor />}
</aside>
);
}
export default CodeBar;App.js
Kod:
import logo from './logo.svg';
import './App.css';
import CodeBar from './components/CodeBar';
import Preview from 'components/Preview';
import Header from 'components/Header';
function App() {
return (
<>
<CodeBar />
<main>
<Header />
<Preview />
</main>
</>
);
}
export default App;Hata
Kod:
<AceEditor
setOptions={{
useWorker: false,
...other props
/>ile çözdüm.
