Skip to content
GitLab
Menu
Projects
Groups
Snippets
Loading...
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
Menu
Open sidebar
students
online-quiz-react
Commits
792fea49
Commit
792fea49
authored
Aug 10, 2020
by
baesangjune
Browse files
timer 수정
parent
67bc8294
Changes
8
Hide whitespace changes
Inline
Side-by-side
src/Admin.js
0 → 100644
View file @
792fea49
import
React
from
'
react
'
;
// import { Link } from 'react-router-dom';
function
Admin
()
{
return
(
<>
<
div
>
<
div
className
=
"
container
"
>
<
div
className
=
"
row d-flex justify-content-center
"
>
<
div
className
=
"
col-8
"
>
<
div
>
<
h2
>
문제를
입력하세요
<
/h2
>
<
input
type
=
"
text
"
/><
button
>
전송
<
/button
>
<
/div
>
<
div
>
<
h2
>
보기를
입력하세요
<
/h2
>
<
input
type
=
"
text
"
/><
button
>
전송
<
/button
>
<
/div
>
<
div
>
<
h2
>
답을
입력하세요
<
/h2
>
<
input
type
=
"
text
"
/><
button
>
전송
<
/button
>
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
/
>
)
}
export
default
Admin
\ No newline at end of file
src/App.js
View file @
792fea49
...
@@ -3,8 +3,9 @@ import './App.css';
...
@@ -3,8 +3,9 @@ import './App.css';
import
Home
from
'
./Home
'
import
Home
from
'
./Home
'
import
Quiz
from
'
./Quiz
'
import
Quiz
from
'
./Quiz
'
import
End
from
'
./End
'
import
End
from
'
./End
'
import
Admin
from
'
./Admin
'
import
{
BrowserRouter
as
Router
,
Link
,
Switch
,
Route
}
from
'
react-router-dom
'
;
import
{
BrowserRouter
as
Router
,
Link
,
Switch
,
Route
,
Redirect
}
from
'
react-router-dom
'
;
function
App
()
{
function
App
()
{
return
(
return
(
...
@@ -14,18 +15,18 @@ function App() {
...
@@ -14,18 +15,18 @@ function App() {
<
button
>
Calculus
<
/button
>
<
button
>
Calculus
<
/button
>
<
/Link
>
<
/Link
>
<
/header
>
<
/header
>
<
hr
/>
<
hr
/>
<
div
>
<
div
>
<
Switch
>
<
Switch
>
<
Route
exact
path
=
"
/
"
>
<
Route
exact
path
=
"
/
"
component
=
{
Home
}
/
>
<
Home
/>
<
/
Route
>
<
Route
path
=
"
/quiz
"
component
=
{
Quiz
}
/
>
<
Route
path
=
"
/quiz
"
>
<
Quiz
/>
<
Route
path
=
"
/end
"
component
=
{
End
}
/
>
<
/Route
>
<
Route
path
=
"
/
end
"
>
<
Route
path
=
"
/
admin
"
component
=
{
Admin
}
/
>
<
End
/>
<
/Route
>
<
Redirect
path
=
"
/admin
"
to
=
"
/admin
"
/
>
<
/Switch
>
<
/Switch
>
<
/div
>
<
/div
>
<
/Router
>
<
/Router
>
...
...
src/App2.js
0 → 100644
View file @
792fea49
import
React
from
'
react
'
;
import
'
./App.css
'
;
function
App
()
{
return
(
<
div
>
<
header
>
<
Link
to
=
"
/
"
>
<
button
>
Calculus
<
/button
>
<
/Link
>
<
/header
>
<
hr
/>
<
/div
>
)
}
export
default
App
;
\ No newline at end of file
src/End.js
View file @
792fea49
import
React
from
'
react
'
import
React
from
'
react
'
import
tr
from
'
./img_end.jpg
'
;
//
import tr from './img_end.jpg';
// import { Link } from 'react-router-dom';
// import { Link } from 'react-router-dom';
...
...
src/Home.js
View file @
792fea49
// import bg from './img_study.jpg'
// import bg from './img_study.jpg'
// import korea from './img_korea.jpg'
// import korea from './img_korea.jpg'
import
React
,
{
useState
}
from
'
react
'
import
React
,
{
useState
}
from
'
react
'
import
{
Redirect
}
from
'
react-router-dom
'
;
import
{
Redirect
}
from
'
react-router-dom
'
;
function
Home
()
{
function
Home
()
{
const
[
name
,
setName
]
=
useState
(
''
)
const
[
name
,
setName
]
=
useState
(
''
)
const
[
password
,
SetPassword
]
=
useState
(
''
)
const
[
password
,
SetPassword
]
=
useState
(
''
)
const
[
done
,
setDone
]
=
useState
(
false
)
const
[
done
,
setDone
]
=
useState
(
false
)
const
[
admin
,
setAdmin
]
=
useState
(
false
);
const
handleChangename
=
(
event
)
=>
{
const
handleChangename
=
(
event
)
=>
{
setName
(
event
.
target
.
value
)
setName
(
event
.
target
.
value
)
}
}
...
@@ -23,6 +24,13 @@ function Home() {
...
@@ -23,6 +24,13 @@ function Home() {
else
if
(
!
password
)
{
else
if
(
!
password
)
{
alert
(
'
비밀번호를 입력하세요
'
)
alert
(
'
비밀번호를 입력하세요
'
)
}
}
else
if
(
name
===
'
admin
'
&&
password
===
'
0001
'
)
{
console
.
log
(
'
done
'
)
return
(
setAdmin
(
true
)
)
}
else
if
(
password
!==
'
0319
'
)
{
else
if
(
password
!==
'
0319
'
)
{
alert
(
'
유효한 비밀번호를 입력하세요
'
)
alert
(
'
유효한 비밀번호를 입력하세요
'
)
}
}
...
@@ -35,17 +43,22 @@ function Home() {
...
@@ -35,17 +43,22 @@ function Home() {
}
}
return
(
return
(
<>
<>
{
admin
?
<
Redirect
to
=
'
/admin
'
/>
:
''
}
{
done
?
<
Redirect
to
=
'
/quiz
'
/>
:
''
}
{
done
?
<
Redirect
to
=
'
/quiz
'
/>
:
''
}
{
/* <div style={{ backgroundImage: 'url(' + bg + ')', backgroundColor: "grey", backgroundSize: "100%", width: "100%", height: "880px", backgroundRepeat: 'no-repeat' }}>
{
/* <div style={{ backgroundImage: 'url(' + bg + ')', backgroundColor: "grey", backgroundSize: "100%", width: "100%", height: "880px", backgroundRepeat: 'no-repeat' }}>
*/
}
<div className="Main"></div>
*/
}
<
div
className
=
"
Main
"
><
/div
>
<
div
style
=
{{
fontSize
:
'
70px
'
,
marginBottom
:
'
100px
'
,
textAlign
:
'
center
'
,
backgroundColor
:
'
#AE0E36
'
}}
>
<
div
style
=
{{
fontSize
:
'
70px
'
,
marginBottom
:
'
100px
'
,
textAlign
:
'
center
'
,
backgroundColor
:
'
#AE0E36
'
}}
>
{
/* <img alt='korea' src={korea} width='10%'/> */
}
{
/* <img alt='korea' src={korea} width='10%'/> */
}
KOREA
UNIVERSITY
KOREA
UNIVERSITY
<
/div
>
<
/div
>
<
div
className
=
"
d-flex justify-content-center
"
>
<
div
className
=
"
d-flex justify-content-center
"
>
<
table
className
=
"
table table-bordered dark-table
"
style
=
{{
width
:
"
400px
"
}}
>
<
table
className
=
"
table table-bordered dark-table
"
style
=
{{
width
:
"
400px
"
}}
>
...
@@ -60,8 +73,10 @@ function Home() {
...
@@ -60,8 +73,10 @@ function Home() {
<
td
>
비밀번호
<
input
type
=
'
password
'
className
=
"
ml-2 inputBox
"
onChange
=
{
handleChangepassword
}
/></
td
>
<
td
>
비밀번호
<
input
type
=
'
password
'
className
=
"
ml-2 inputBox
"
onChange
=
{
handleChangepassword
}
/></
td
>
<
/tr
>
<
/tr
>
<
tr
>
<
tr
>
<
td
><
button
className
=
"
mt-4 btn btn-dark
"
onClick
=
{
checking
}
>
Login
<
/button></
td
>
<
td
>
<
button
className
=
"
mt-4 btn btn-dark
"
onClick
=
{
checking
}
>
Login
<
/button></
td
>
<
/tr
>
<
/tr
>
<
/tbody
>
<
/tbody
>
<
/table
>
<
/table
>
<
/div
>
<
/div
>
...
...
src/Quiz.js
View file @
792fea49
import
React
,
{
useState
}
from
'
react
'
import
React
,
{
useState
}
from
'
react
'
import
{
Link
}
from
'
react-router-dom
'
;
import
{
Link
,
Redirect
}
from
'
react-router-dom
'
;
import
Timer
from
'
react-compound-timer
'
;
// 타이머쓰기위해 import
import
Timer
from
'
react-compound-timer
'
;
// 타이머쓰기위해 import
import
logo
from
'
./img_question.png
'
import
logo
from
'
./img_question.png
'
...
@@ -11,7 +11,8 @@ const QnA = [
...
@@ -11,7 +11,8 @@ const QnA = [
{
Q
:
"
3 - 1 = ?
"
,
Choose
:
[
1
,
2
,
3
,
4
],
A
:
"
2
"
,
N
:
3
}
{
Q
:
"
3 - 1 = ?
"
,
Choose
:
[
1
,
2
,
3
,
4
],
A
:
"
2
"
,
N
:
3
}
]
]
let
Answers
=
[]
let
Answers
=
[
0
,
0
,
0
]
localStorage
.
setItem
(
'
Answers
'
,
JSON
.
stringify
(
Answers
))
let
Solutions
=
[
4
,
3
,
2
]
let
Solutions
=
[
4
,
3
,
2
]
localStorage
.
setItem
(
'
Solutions
'
,
JSON
.
stringify
(
Solutions
))
localStorage
.
setItem
(
'
Solutions
'
,
JSON
.
stringify
(
Solutions
))
...
@@ -24,6 +25,8 @@ function Quiz() {
...
@@ -24,6 +25,8 @@ function Quiz() {
const
[
selected
,
setSelected
]
=
useState
(
""
)
//선택한 답을 보여줄 것들
const
[
selected
,
setSelected
]
=
useState
(
""
)
//선택한 답을 보여줄 것들
// const [checked, setChecked] = useState(false)
// const [checked, setChecked] = useState(false)
const
[
timeout
,
settimeout
]
=
useState
(
false
)
function
handleQuestion
()
{
function
handleQuestion
()
{
setQuestion
({
...
QnA
[
question
.
i
+
1
],
i
:
question
.
i
+
1
,
page
:
question
.
page
+
1
})
setQuestion
({
...
QnA
[
question
.
i
+
1
],
i
:
question
.
i
+
1
,
page
:
question
.
page
+
1
})
// setChecked(false)
// setChecked(false)
...
@@ -35,8 +38,10 @@ function Quiz() {
...
@@ -35,8 +38,10 @@ function Quiz() {
Answers
[
question
.
N
-
1
]
=
Number
(
ev
.
target
.
id
)
+
1
Answers
[
question
.
N
-
1
]
=
Number
(
ev
.
target
.
id
)
+
1
localStorage
.
setItem
(
'
Answers
'
,
JSON
.
stringify
(
Answers
))
localStorage
.
setItem
(
'
Answers
'
,
JSON
.
stringify
(
Answers
))
}
}
return
(
return
(
<>
<
div
className
=
"
container-fluid position-absolute
"
>
<
div
className
=
"
container-fluid position-absolute
"
>
<
div
className
=
"
text-center h2 font-weight-bold bg-warning py-2
"
>
미적분학
퀴즈
<
/div
>
<
div
className
=
"
text-center h2 font-weight-bold bg-warning py-2
"
>
미적분학
퀴즈
<
/div
>
<
div
className
=
"
row justify-content-md-center
"
>
<
div
className
=
"
row justify-content-md-center
"
>
...
@@ -70,13 +75,16 @@ function Quiz() {
...
@@ -70,13 +75,16 @@ function Quiz() {
<
/div
>
<
/div
>
<
p
className
=
"
h3 text-center text-danger
"
>
<
p
className
=
"
h3 text-center text-danger
"
>
<
Timer
<
Timer
initialTime
=
{
36000
00
}
initialTime
=
{
36000
}
direction
=
"
backward
"
direction
=
"
backward
"
checkpoints
=
{[
checkpoints
=
{[
{
time
:
1
,
callback
:()
=>
alert
(
'
시간이 초과되었습니다.
'
),
},
{
{
time
:
0
,
time
:
0
,
callback
:
<
Link
to
=
"
/end
"
>
제출
<
/Link
>
callback
:
()
=>
settimeout
(
true
),
// history.go(1)
}
}
]}
]}
>
>
...
@@ -92,6 +100,8 @@ function Quiz() {
...
@@ -92,6 +100,8 @@ function Quiz() {
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
/div
>
{
timeout
?
<
Redirect
to
=
'
/end
'
/>
:
''
}
<
/
>
)
)
...
...
src/index.js
View file @
792fea49
import
React
from
'
react
'
;
import
React
from
'
react
'
;
import
ReactDOM
from
'
react-dom
'
;
import
ReactDOM
from
'
react-dom
'
;
import
'
react-dom
'
import
'
./index.css
'
;
import
'
./index.css
'
;
import
App
from
'
./App
'
;
import
App
from
'
./App
'
;
// import Quiz from './Quiz';
// import Quiz from './Quiz';
...
...
src/index2.js
0 → 100644
View file @
792fea49
import
React
from
'
react
'
;
import
ReactDOM
from
'
react-dom
'
;
import
'
react-dom
'
import
'
./index.css
'
;
import
Home
from
'
./Home
'
import
Quiz
from
'
./Quiz
'
import
End
from
'
./End
'
import
{
BrowserRouter
as
Router
,
Route
}
from
'
react-router-dom
'
;
// import Quiz from './Quiz';
import
*
as
serviceWorker
from
'
./serviceWorker
'
;
import
'
bootstrap/dist/css/bootstrap.css
'
ReactDOM
.
render
(
<
Router
>
<
Route
exact
path
=
"
/
"
component
=
{
Home
}
/
>
<
Route
path
=
'
/quiz
'
component
=
{
Quiz
}
/
>
<
Route
path
=
'
/end
'
component
=
{
End
}
/
>
<
/Router>
,
document
.
getElementById
(
'
root
'
)
);
// If you want your app to work offline and load faster, you can change
// unregister() to register() below. Note this comes with some pitfalls.
// Learn more about service workers: https://bit.ly/CRA-PWA
serviceWorker
.
unregister
();
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment