david/1st-project
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

initial commit

Browse Source 
새로운 repository 를 만들었습니다.
This commit is contained in:
David Ko
2025-04-29 14:11:00 +09:00
commit 82f8b93a2c
127 changed files with 7053422 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
react-url-checker/.gitignore vendored Normal file
View File

@@ -0,0 +1 @@
/node_modules

46
react-url-checker/README.md Normal file
View File

@@ -0,0 +1,46 @@
# Getting Started with Create React App
This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
## Available Scripts
In the project directory, you can run:
### `npm start`
Runs the app in the development mode.\
Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
The page will reload if you make edits.\
You will also see any lint errors in the console.
### `npm test`
Launches the test runner in the interactive watch mode.\
See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.
### `npm run build`
Builds the app for production to the `build` folder.\
It correctly bundles React in production mode and optimizes the build for the best performance.
The build is minified and the filenames include the hashes.\
Your app is ready to be deployed!
See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.
### `npm run eject`
**Note: this is a one-way operation. Once you `eject`, you can’t go back!**
If you aren’t satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project.
Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you’re on your own.
You don’t have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it.
## Learn More
You can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started).
To learn React, check out the [React documentation](https://reactjs.org/).

22
react-url-checker/build/asset-manifest.json Normal file
View File

@@ -0,0 +1,22 @@
{
"files": {
"main.css": "/static/css/main.c2e85bbc.chunk.css",
"main.js": "/static/js/main.6a620daf.chunk.js",
"main.js.map": "/static/js/main.6a620daf.chunk.js.map",
"runtime-main.js": "/static/js/runtime-main.448eb57c.js",
"runtime-main.js.map": "/static/js/runtime-main.448eb57c.js.map",
"static/js/2.73aa0cc9.chunk.js": "/static/js/2.73aa0cc9.chunk.js",
"static/js/2.73aa0cc9.chunk.js.map": "/static/js/2.73aa0cc9.chunk.js.map",
"index.html": "/index.html",
"precache-manifest.243c3016b2bcd7a26a857500b8d69f83.js": "/precache-manifest.243c3016b2bcd7a26a857500b8d69f83.js",
"service-worker.js": "/service-worker.js",
"static/css/main.c2e85bbc.chunk.css.map": "/static/css/main.c2e85bbc.chunk.css.map",
"static/js/2.73aa0cc9.chunk.js.LICENSE.txt": "/static/js/2.73aa0cc9.chunk.js.LICENSE.txt"
},
"entrypoints": [
"static/js/runtime-main.448eb57c.js",
"static/js/2.73aa0cc9.chunk.js",
"static/css/main.c2e85bbc.chunk.css",
"static/js/main.6a620daf.chunk.js"
]
}

BIN
react-url-checker/build/favicon.ico Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.8 KiB

1
react-url-checker/build/index.html Normal file
View File

@@ -0,0 +1 @@
<!doctype html><html lang="ko"><head><meta charset="UTF-8"/><meta name="viewport" content="width=device-width,initial-scale=1"/><title>URL 악성 판별기</title><link href="/static/css/main.c2e85bbc.chunk.css" rel="stylesheet"></head><body><div id="root"></div><script>!function(e){function r(r){for(var n,l,c=r[0],a=r[1],f=r[2],p=0,s=[];p<c.length;p++)l=c[p],Object.prototype.hasOwnProperty.call(o,l)&&o[l]&&s.push(o[l][0]),o[l]=0;for(n in a)Object.prototype.hasOwnProperty.call(a,n)&&(e[n]=a[n]);for(i&&i(r);s.length;)s.shift()();return u.push.apply(u,f||[]),t()}function t(){for(var e,r=0;r<u.length;r++){for(var t=u[r],n=!0,c=1;c<t.length;c++){var a=t[c];0!==o[a]&&(n=!1)}n&&(u.splice(r--,1),e=l(l.s=t[0]))}return e}var n={},o={1:0},u=[];function l(r){if(n[r])return n[r].exports;var t=n[r]={i:r,l:!1,exports:{}};return e[r].call(t.exports,t,t.exports,l),t.l=!0,t.exports}l.m=e,l.c=n,l.d=function(e,r,t){l.o(e,r)||Object.defineProperty(e,r,{enumerable:!0,get:t})},l.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},l.t=function(e,r){if(1&r&&(e=l(e)),8&r)return e;if(4&r&&"object"==typeof e&&e&&e.__esModule)return e;var t=Object.create(null);if(l.r(t),Object.defineProperty(t,"default",{enumerable:!0,value:e}),2&r&&"string"!=typeof e)for(var n in e)l.d(t,n,function(r){return e[r]}.bind(null,n));return t},l.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return l.d(r,"a",r),r},l.o=function(e,r){return Object.prototype.hasOwnProperty.call(e,r)},l.p="/";var c=this["webpackJsonpreact-url-checker"]=this["webpackJsonpreact-url-checker"]||[],a=c.push.bind(c);c.push=r,c=c.slice();for(var f=0;f<c.length;f++)r(c[f]);var i=a;t()}([])</script><script src="/static/js/2.73aa0cc9.chunk.js"></script><script src="/static/js/main.6a620daf.chunk.js"></script></body></html>

BIN
react-url-checker/build/logo192.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.2 KiB

BIN
react-url-checker/build/logo512.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 9.4 KiB

25
react-url-checker/build/manifest.json Normal file
View File

@@ -0,0 +1,25 @@
{
"short_name": "React App",
"name": "Create React App Sample",
"icons": [
{
"src": "favicon.ico",
"sizes": "64x64 32x32 24x24 16x16",
"type": "image/x-icon"
},
{
"src": "logo192.png",
"type": "image/png",
"sizes": "192x192"
},
{
"src": "logo512.png",
"type": "image/png",
"sizes": "512x512"
}
],
"start_url": ".",
"display": "standalone",
"theme_color": "#000000",
"background_color": "#ffffff"
}

26
react-url-checker/build/precache-manifest.243c3016b2bcd7a26a857500b8d69f83.js Normal file
View File

@@ -0,0 +1,26 @@
self.__precacheManifest = (self.__precacheManifest || []).concat([
{
"revision": "051fa3b4948f4ec1183af15c9127ee2c",
"url": "/index.html"
},
{
"revision": "c485b6d07275f81bf98c",
"url": "/static/css/main.c2e85bbc.chunk.css"
},
{
"revision": "76977dad6abf39d3317c",
"url": "/static/js/2.73aa0cc9.chunk.js"
},
{
"revision": "4cb447811eafcde62d61d67183d8b566",
"url": "/static/js/2.73aa0cc9.chunk.js.LICENSE.txt"
},
{
"revision": "c485b6d07275f81bf98c",
"url": "/static/js/main.6a620daf.chunk.js"
},
{
"revision": "2950871f0a1225222eb6",
"url": "/static/js/runtime-main.448eb57c.js"
}
]);

3
react-url-checker/build/robots.txt Normal file
View File

@@ -0,0 +1,3 @@
# https://www.robotstxt.org/robotstxt.html
User-agent: *
Disallow:

39
react-url-checker/build/service-worker.js vendored Normal file
View File

@@ -0,0 +1,39 @@
/**
* Welcome to your Workbox-powered service worker!
*
* You'll need to register this file in your web app and you should
* disable HTTP caching for this file too.
* See https://goo.gl/nhQhGp
*
* The rest of the code is auto-generated. Please don't update this file
* directly; instead, make changes to your Workbox build configuration
* and re-run your build process.
* See https://goo.gl/2aRDsh
*/
importScripts("https://storage.googleapis.com/workbox-cdn/releases/4.3.1/workbox-sw.js");
importScripts(
"/precache-manifest.243c3016b2bcd7a26a857500b8d69f83.js"
);
self.addEventListener('message', (event) => {
if (event.data && event.data.type === 'SKIP_WAITING') {
self.skipWaiting();
}
});
workbox.core.clientsClaim();
/**
* The workboxSW.precacheAndRoute() method efficiently caches and responds to
* requests for URLs in the manifest.
* See https://goo.gl/S9QRab
*/
self.__precacheManifest = [].concat(self.__precacheManifest || []);
workbox.precaching.precacheAndRoute(self.__precacheManifest, {});
workbox.routing.registerNavigationRoute(workbox.precaching.getCacheKeyForURL("/index.html"), {
blacklist: [/^\/_/,/\/[^/?]+\.[^/]+$/],
});

2
react-url-checker/build/static/css/main.c2e85bbc.chunk.css Normal file
View File

@@ -0,0 +1,2 @@
@tailwind base;@tailwind components;@tailwind utilities;body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,"Courier New",monospace}.App{text-align:center}.App-logo{height:40vmin;pointer-events:none}@media (prefers-reduced-motion:no-preference){.App-logo{animation:App-logo-spin 20s linear infinite}}.App-header{background-color:#282c34;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:calc(10px + 2vmin);color:#fff}.App-link{color:#61dafb}@keyframes App-logo-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}body{margin:0;font-family:"Arial",sans-serif;background:#fff}.container{height:100vh;width:100vw;max-width:1280px;margin:0 auto;flex-direction:column}.container,.title{display:flex;align-items:center;justify-content:center}.title{font-size:24px;font-weight:700;margin-bottom:40px}.url-form{display:flex;width:500px;background-color:#e5e5e5;border:1px solid #aaa;border-radius:5px;box-shadow:2px 2px 4px #ccc;overflow:hidden}.url-input{flex:1 1;padding:12px 16px;border:none;font-size:16px;font-weight:700;background-color:initial;outline:none}.check-button{background-color:#d6f32f;border:none;padding:0 16px;font-size:20px;cursor:pointer}.result-box{margin-top:50px;width:600px;background-color:#fafafa;padding:30px;text-align:center;border-radius:5px}.result-content{margin-top:10px;font-size:16px}
/*# sourceMappingURL=main.c2e85bbc.chunk.css.map */

1
react-url-checker/build/static/css/main.c2e85bbc.chunk.css.map Normal file
View File

@@ -0,0 +1 @@
{"version":3,"sources":["index.css","App.css"],"names":[],"mappings":"AAAA,cAAc,CACd,oBAAoB,CACpB,mBAAmB,CAGnB,KAEE,mJAEY,CACZ,kCAAmC,CACnC,iCACF,CAEA,KACE,yEAEF,CCjBA,KACE,iBACF,CAEA,UACE,aAAc,CACd,mBACF,CAEA,8CACE,UACE,2CACF,CACF,CAEA,YACE,wBAAyB,CACzB,gBAAiB,CACjB,YAAa,CACb,qBAAsB,CACtB,kBAAmB,CACnB,sBAAuB,CACvB,4BAA6B,CAC7B,UACF,CAEA,UACE,aACF,CAEA,yBACE,GACE,sBACF,CACA,GACE,uBACF,CACF,CAEA,KACE,QAAS,CACT,8BAAgC,CAChC,eACF,CAEA,WACE,YAAa,CACb,WAAY,CACZ,gBAAiB,CACjB,aAAc,CAEd,qBAGF,CAEA,kBANE,YAAa,CAEb,kBAAmB,CACnB,sBAUF,CAPA,OACE,cAAe,CACf,eAAiB,CACjB,kBAIF,CAEA,UACE,YAAa,CACb,WAAY,CACZ,wBAAyB,CACzB,qBAAsB,CACtB,iBAAkB,CAClB,2BAA4B,CAC5B,eACF,CAEA,WACE,QAAO,CACP,iBAAkB,CAClB,WAAY,CACZ,cAAe,CACf,eAAiB,CACjB,wBAA6B,CAC7B,YACF,CAEA,cACE,wBAAyB,CACzB,WAAY,CACZ,cAAe,CACf,cAAe,CACf,cACF,CAEA,YACE,eAAgB,CAChB,WAAY,CACZ,wBAAyB,CACzB,YAAa,CACb,iBAAkB,CAClB,iBACF,CAEA,gBACE,eAAgB,CAChB,cACF","file":"main.c2e85bbc.chunk.css","sourcesContent":["@tailwind base;\n@tailwind components;\n@tailwind utilities;\n\n\nbody {\n margin: 0;\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',\n 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',\n sans-serif;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n}\n\ncode {\n font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',\n monospace;\n}\n",".App {\n text-align: center;\n}\n\n.App-logo {\n height: 40vmin;\n pointer-events: none;\n}\n\n@media (prefers-reduced-motion: no-preference) {\n .App-logo {\n animation: App-logo-spin infinite 20s linear;\n }\n}\n\n.App-header {\n background-color: #282c34;\n min-height: 100vh;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n font-size: calc(10px + 2vmin);\n color: white;\n}\n\n.App-link {\n color: #61dafb;\n}\n\n@keyframes App-logo-spin {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n}\n\nbody {\n margin: 0;\n font-family: 'Arial', sans-serif;\n background: white;\n}\n\n.container {\n height: 100vh;\n width: 100vw;\n max-width: 1280px;\n margin: 0 auto;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n}\n\n.title {\n font-size: 24px;\n font-weight: bold;\n margin-bottom: 40px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.url-form {\n display: flex;\n width: 500px;\n background-color: #e5e5e5;\n border: 1px solid #aaa;\n border-radius: 5px;\n box-shadow: 2px 2px 4px #ccc;\n overflow: hidden;\n}\n\n.url-input {\n flex: 1;\n padding: 12px 16px;\n border: none;\n font-size: 16px;\n font-weight: bold;\n background-color: transparent;\n outline: none;\n}\n\n.check-button {\n background-color: #d6f32f;\n border: none;\n padding: 0 16px;\n font-size: 20px;\n cursor: pointer;\n}\n\n.result-box {\n margin-top: 50px;\n width: 600px;\n background-color: #fafafa;\n padding: 30px;\n text-align: center;\n border-radius: 5px;\n}\n\n.result-content {\n margin-top: 10px;\n font-size: 16px;\n}\n"]}

3
react-url-checker/build/static/js/2.73aa0cc9.chunk.js Normal file
View File

File diff suppressed because one or more lines are too long

48
react-url-checker/build/static/js/2.73aa0cc9.chunk.js.LICENSE.txt Normal file
View File

@@ -0,0 +1,48 @@
/*!
* The buffer module from node.js, for the browser.
*
* @author Feross Aboukhadijeh <http://feross.org>
* @license MIT
*/
/*! ieee754. BSD-3-Clause License. Feross Aboukhadijeh <https://feross.org/opensource> */
/**
* @license React
* react-dom-client.production.js
*
* Copyright (c) Meta Platforms, Inc. and affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
/**
* @license React
* react-dom.production.js
*
* Copyright (c) Meta Platforms, Inc. and affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
/**
* @license React
* react.production.js
*
* Copyright (c) Meta Platforms, Inc. and affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
/**
* @license React
* scheduler.production.js
*
* Copyright (c) Meta Platforms, Inc. and affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/

1
react-url-checker/build/static/js/2.73aa0cc9.chunk.js.map Normal file
View File

File diff suppressed because one or more lines are too long

2
react-url-checker/build/static/js/main.6a620daf.chunk.js Normal file
View File

@@ -0,0 +1,2 @@
(this["webpackJsonpreact-url-checker"]=this["webpackJsonpreact-url-checker"]||[]).push([[0],{10:function(e,t,a){e.exports=a(24)},18:function(e,t,a){},23:function(e,t,a){},24:function(e,t,a){"use strict";a.r(t);var l=a(2),r=a.n(l),n=a(9),c=a.n(n),s=(a(18),a(26));var m=()=>{const[e,t]=Object(l.useState)(""),[a,n]=Object(l.useState)(null),[c,m]=Object(l.useState)(!1),[o,u]=Object(l.useState)("");return r.a.createElement("div",{className:"flex flex-col min-h-screen bg-white"},r.a.createElement("main",{className:"flex-grow flex items-center justify-center"},r.a.createElement("form",{onSubmit:async t=>{t.preventDefault(),m(!0),n(null),u("");try{const t=await s.a.post("http://34.64.139.6:8000/predict",{url:e});n(t.data)}catch(a){console.error(a),u("\uc11c\ubc84 \uc624\ub958\uac00 \ubc1c\uc0dd\ud588\uc2b5\ub2c8\ub2e4.")}finally{m(!1)}},className:"space-y-4 w-full max-w-md mx-auto"},r.a.createElement("input",{type:"text",value:e,onChange:e=>t(e.target.value),placeholder:"Enter URL",className:"w-full p-3 border border-gray-300 rounded shadow",required:!0}),r.a.createElement("button",{type:"submit",className:"w-full p-2 bg-blue-500 text-white rounded hover:bg-blue-600 transition"},"\u2705 \uac80\uc0ac\ud558\uae30")),r.a.createElement("div",{className:"mt-6"},c&&r.a.createElement("p",null,"\ud83d\udd04 \ubd84\uc11d \uc911..."),o&&r.a.createElement("p",{className:"text-red-500"},"\u274c ",o),a&&r.a.createElement("div",{className:"mt-4 p-4 bg-gray-50 rounded shadow"},r.a.createElement("p",{className:"mb-2"},"\uc545\uc131 \ud655\ub960:"," ",r.a.createElement("strong",null,(100*parseFloat(a.malicious_probability)).toFixed(2),"%")),r.a.createElement("p",null,"\ud310\ubcc4 \uacb0\uacfc:"," ",r.a.createElement("strong",{className:a.is_malicious?"text-red-600":"text-green-600"},a.is_malicious?"\u26a0\ufe0f \uc545\uc131 URL":"\u2705 \uc815\uc0c1 URL"))))))};a(23);var o=function(){return r.a.createElement("div",{className:"min-h-screen bg-gray-100 flex flex-col justify-center"},r.a.createElement("div",{className:"container mx-auto px-4 text-center"},r.a.createElement("h1",{className:"text-3xl font-bold text-blue-600 mb-6"},"\ud83d\udd0d \uc545\uc131 URL \ud310\ubcc4\uae30"),r.a.createElement(m,null)))};c.a.createRoot(document.getElementById("root")).render(r.a.createElement(r.a.StrictMode,null,r.a.createElement(o,null)))}},[[10,1,2]]]);
//# sourceMappingURL=main.6a620daf.chunk.js.map

1
react-url-checker/build/static/js/main.6a620daf.chunk.js.map Normal file
View File

@@ -0,0 +1 @@
{"version":3,"sources":["components/UrlPredictor.jsx","App.js","index.js"],"names":["UrlPredictor","url","setUrl","useState","result","setResult","loading","setLoading","error","setError","React","createElement","className","onSubmit","async","e","preventDefault","response","axios","post","data","err","console","type","value","onChange","target","placeholder","required","parseFloat","malicious_probability","toFixed","is_malicious","App","ReactDOM","createRoot","document","getElementById","render","StrictMode"],"mappings":"sQAwEeA,MArEMA,KACnB,MAAOC,EAAKC,GAAUC,mBAAS,KACxBC,EAAQC,GAAaF,mBAAS,OAC9BG,EAASC,GAAcJ,oBAAS,IAChCK,EAAOC,GAAYN,mBAAS,IAqBnC,OACEO,IAAAC,cAAA,OAAKC,UAAU,uCACbF,IAAAC,cAAA,QAAMC,UAAU,8CAChBF,IAAAC,cAAA,QAAME,SAtBWC,UACnBC,EAAEC,iBACFT,GAAW,GACXF,EAAU,MACVI,EAAS,IAET,IACE,MAAMQ,QAAiBC,IAAMC,KAAK,kCAAmC,CACnElB,IAAKA,IAEPI,EAAUY,EAASG,MACnB,MAAOC,GACPC,QAAQd,MAAMa,GACdZ,EAAS,yEACV,QACCF,GAAW,KAOmBK,UAAU,qCACtCF,IAAAC,cAAA,SACEY,KAAK,OACLC,MAAOvB,EACPwB,SAAWV,GAAMb,EAAOa,EAAEW,OAAOF,OACjCG,YAAY,YACZf,UAAU,mDACVgB,UAAQ,IAEVlB,IAAAC,cAAA,UACEY,KAAK,SACLX,UAAU,0EACX,oCAKHF,IAAAC,cAAA,OAAKC,UAAU,QACZN,GAAWI,IAAAC,cAAA,SAAG,uCACdH,GAASE,IAAAC,cAAA,KAAGC,UAAU,gBAAe,UAAGJ,GACxCJ,GACCM,IAAAC,cAAA,OAAKC,UAAU,sCACbF,IAAAC,cAAA,KAAGC,UAAU,QAAO,6BACX,IACPF,IAAAC,cAAA,eAAqD,IAA3CkB,WAAWzB,EAAO0B,wBAA8BC,QAAQ,GAAG,MAEvErB,IAAAC,cAAA,SAAG,6BACM,IACPD,IAAAC,cAAA,UAAQC,UAAWR,EAAO4B,aAAe,eAAiB,kBACvD5B,EAAO4B,aAAe,gCAAc,iC,MC3CtCC,MAZf,WACE,OACFvB,IAAAC,cAAA,OAAKC,UAAU,yDACbF,IAAAC,cAAA,OAAKC,UAAU,sCACbF,IAAAC,cAAA,MAAIC,UAAU,yCAAwC,oDACtDF,IAAAC,cAACX,EAAY,SCLJkC,IAASC,WAAWC,SAASC,eAAe,SACpDC,OACH5B,IAAAC,cAACD,IAAM6B,WAAU,KACf7B,IAAAC,cAACsB,EAAG,U","file":"static/js/main.6a620daf.chunk.js","sourcesContent":["import React, { useState } from \"react\";\nimport axios from \"axios\";\n\nconst UrlPredictor = () => {\n const [url, setUrl] = useState(\"\");\n const [result, setResult] = useState(null);\n const [loading, setLoading] = useState(false);\n const [error, setError] = useState(\"\");\n\n const handleSubmit = async (e) => {\n e.preventDefault();\n setLoading(true);\n setResult(null);\n setError(\"\");\n\n try {\n const response = await axios.post(\"http://34.64.139.6:8000/predict\", {\n url: url,\n });\n setResult(response.data);\n } catch (err) {\n console.error(err);\n setError(\"서버 오류가 발생했습니다.\");\n } finally {\n setLoading(false);\n }\n };\n\n return (\n <div className=\"flex flex-col min-h-screen bg-white\">\n <main className=\"flex-grow flex items-center justify-center\">\n <form onSubmit={handleSubmit} className=\"space-y-4 w-full max-w-md mx-auto\">\n <input\n type=\"text\"\n value={url}\n onChange={(e) => setUrl(e.target.value)}\n placeholder=\"Enter URL\"\n className=\"w-full p-3 border border-gray-300 rounded shadow\"\n required\n />\n <button\n type=\"submit\"\n className=\"w-full p-2 bg-blue-500 text-white rounded hover:bg-blue-600 transition\"\n >\n ✅ 검사하기\n </button>\n </form>\n \n <div className=\"mt-6\">\n {loading && <p>🔄 분석 중...</p>}\n {error && <p className=\"text-red-500\">❌ {error}</p>}\n {result && (\n <div className=\"mt-4 p-4 bg-gray-50 rounded shadow\">\n <p className=\"mb-2\">\n 악성 확률:{\" \"}\n <strong>{(parseFloat(result.malicious_probability) * 100).toFixed(2)}%</strong>\n </p>\n <p>\n 판별 결과:{\" \"}\n <strong className={result.is_malicious ? \"text-red-600\" : \"text-green-600\"}>\n {result.is_malicious ? \"⚠️ 악성 URL\" : \"✅ 정상 URL\"}\n </strong>\n </p>\n </div>\n )}\n </div>\n </main>\n </div>\n\n );\n};\n\nexport default UrlPredictor;\n","// src/App.js\nimport React from \"react\";\nimport UrlPredictor from \"./components/UrlPredictor\";\nimport './App.css';\n\nfunction App() {\n return (\n<div className=\"min-h-screen bg-gray-100 flex flex-col justify-center\">\n <div className=\"container mx-auto px-4 text-center\">\n <h1 className=\"text-3xl font-bold text-blue-600 mb-6\">🔍 악성 URL 판별기</h1>\n <UrlPredictor />\n </div>\n</div>\n\n );\n}\n\nexport default App;\n","import React from 'react';\nimport ReactDOM from 'react-dom/client';\nimport './index.css';\nimport App from './App';\n\nconst root = ReactDOM.createRoot(document.getElementById('root'));\nroot.render(\n <React.StrictMode>\n <App />\n </React.StrictMode>\n);\n"],"sourceRoot":""}

2
react-url-checker/build/static/js/runtime-main.448eb57c.js Normal file
View File

@@ -0,0 +1,2 @@
!function(e){function r(r){for(var n,l,c=r[0],a=r[1],f=r[2],p=0,s=[];p<c.length;p++)l=c[p],Object.prototype.hasOwnProperty.call(o,l)&&o[l]&&s.push(o[l][0]),o[l]=0;for(n in a)Object.prototype.hasOwnProperty.call(a,n)&&(e[n]=a[n]);for(i&&i(r);s.length;)s.shift()();return u.push.apply(u,f||[]),t()}function t(){for(var e,r=0;r<u.length;r++){for(var t=u[r],n=!0,c=1;c<t.length;c++){var a=t[c];0!==o[a]&&(n=!1)}n&&(u.splice(r--,1),e=l(l.s=t[0]))}return e}var n={},o={1:0},u=[];function l(r){if(n[r])return n[r].exports;var t=n[r]={i:r,l:!1,exports:{}};return e[r].call(t.exports,t,t.exports,l),t.l=!0,t.exports}l.m=e,l.c=n,l.d=function(e,r,t){l.o(e,r)||Object.defineProperty(e,r,{enumerable:!0,get:t})},l.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},l.t=function(e,r){if(1&r&&(e=l(e)),8&r)return e;if(4&r&&"object"===typeof e&&e&&e.__esModule)return e;var t=Object.create(null);if(l.r(t),Object.defineProperty(t,"default",{enumerable:!0,value:e}),2&r&&"string"!=typeof e)for(var n in e)l.d(t,n,function(r){return e[r]}.bind(null,n));return t},l.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return l.d(r,"a",r),r},l.o=function(e,r){return Object.prototype.hasOwnProperty.call(e,r)},l.p="/";var c=this["webpackJsonpreact-url-checker"]=this["webpackJsonpreact-url-checker"]||[],a=c.push.bind(c);c.push=r,c=c.slice();for(var f=0;f<c.length;f++)r(c[f]);var i=a;t()}([]);
//# sourceMappingURL=runtime-main.448eb57c.js.map

1
react-url-checker/build/static/js/runtime-main.448eb57c.js.map Normal file
View File

File diff suppressed because one or more lines are too long

669
react-url-checker/dist/output.css vendored Normal file
View File

@@ -0,0 +1,669 @@
/*
! tailwindcss v3.3.5 | MIT License | https://tailwindcss.com
*/
/*
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
*/
*,
::before,
::after {
box-sizing: border-box;
/* 1 */
border-width: 0;
/* 2 */
border-style: solid;
/* 2 */
border-color: #e5e7eb;
/* 2 */
}
::before,
::after {
--tw-content: '';
}
/*
1. Use a consistent sensible line-height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
3. Use a more readable tab size.
4. Use the user's configured `sans` font-family by default.
5. Use the user's configured `sans` font-feature-settings by default.
6. Use the user's configured `sans` font-variation-settings by default.
*/
html {
line-height: 1.5;
/* 1 */
-webkit-text-size-adjust: 100%;
/* 2 */
/* 3 */
tab-size: 4;
/* 3 */
font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
/* 4 */
font-feature-settings: normal;
/* 5 */
font-variation-settings: normal;
/* 6 */
}
/*
1. Remove the margin in all browsers.
2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
*/
body {
margin: 0;
/* 1 */
line-height: inherit;
/* 2 */
}
/*
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
3. Ensure horizontal rules are visible by default.
*/
hr {
height: 0;
/* 1 */
color: inherit;
/* 2 */
border-top-width: 1px;
/* 3 */
}
/*
Add the correct text decoration in Chrome, Edge, and Safari.
*/
abbr:where([title]) {
-webkit-text-decoration: underline dotted;
text-decoration: underline dotted;
}
/*
Remove the default font size and weight for headings.
*/
h1,
h2,
h3,
h4,
h5,
h6 {
font-size: inherit;
font-weight: inherit;
}
/*
Reset links to optimize for opt-in styling instead of opt-out.
*/
a {
color: inherit;
text-decoration: inherit;
}
/*
Add the correct font weight in Edge and Safari.
*/
b,
strong {
font-weight: bolder;
}
/*
1. Use the user's configured `mono` font family by default.
2. Correct the odd `em` font sizing in all browsers.
*/
code,
kbd,
samp,
pre {
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
/* 1 */
font-size: 1em;
/* 2 */
}
/*
Add the correct font size in all browsers.
*/
small {
font-size: 80%;
}
/*
Prevent `sub` and `sup` elements from affecting the line height in all browsers.
*/
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sub {
bottom: -0.25em;
}
sup {
top: -0.5em;
}
/*
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
3. Remove gaps between table borders by default.
*/
table {
text-indent: 0;
/* 1 */
border-color: inherit;
/* 2 */
border-collapse: collapse;
/* 3 */
}
/*
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
3. Remove default padding in all browsers.
*/
button,
input,
optgroup,
select,
textarea {
font-family: inherit;
/* 1 */
font-feature-settings: inherit;
/* 1 */
font-variation-settings: inherit;
/* 1 */
font-size: 100%;
/* 1 */
font-weight: inherit;
/* 1 */
line-height: inherit;
/* 1 */
color: inherit;
/* 1 */
margin: 0;
/* 2 */
padding: 0;
/* 3 */
}
/*
Remove the inheritance of text transform in Edge and Firefox.
*/
button,
select {
text-transform: none;
}
/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Remove default button styles.
*/
button,
[type='button'],
[type='reset'],
[type='submit'] {
-webkit-appearance: button;
/* 1 */
background-color: transparent;
/* 2 */
background-image: none;
/* 2 */
}
/*
Use the modern Firefox focus style for all focusable elements.
*/
:-moz-focusring {
outline: auto;
}
/*
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/
:-moz-ui-invalid {
box-shadow: none;
}
/*
Add the correct vertical alignment in Chrome and Firefox.
*/
progress {
vertical-align: baseline;
}
/*
Correct the cursor style of increment and decrement buttons in Safari.
*/
::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
height: auto;
}
/*
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/
[type='search'] {
-webkit-appearance: textfield;
/* 1 */
outline-offset: -2px;
/* 2 */
}
/*
Remove the inner padding in Chrome and Safari on macOS.
*/
::-webkit-search-decoration {
-webkit-appearance: none;
}
/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to `inherit` in Safari.
*/
::-webkit-file-upload-button {
-webkit-appearance: button;
/* 1 */
font: inherit;
/* 2 */
}
/*
Add the correct display in Chrome and Safari.
*/
summary {
display: list-item;
}
/*
Removes the default spacing and border for appropriate elements.
*/
blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
margin: 0;
}
fieldset {
margin: 0;
padding: 0;
}
legend {
padding: 0;
}
ol,
ul,
menu {
list-style: none;
margin: 0;
padding: 0;
}
/*
Reset default styling for dialogs.
*/
dialog {
padding: 0;
}
/*
Prevent resizing textareas horizontally by default.
*/
textarea {
resize: vertical;
}
/*
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
2. Set the default placeholder color to the user's configured gray 400 color.
*/
input::placeholder,
textarea::placeholder {
opacity: 1;
/* 1 */
color: #9ca3af;
/* 2 */
}
/*
Set the default cursor for buttons.
*/
button,
[role="button"] {
cursor: pointer;
}
/*
Make sure disabled buttons don't get the pointer cursor.
*/
:disabled {
cursor: default;
}
/*
1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
This can trigger a poorly considered lint error in some tools but is included by design.
*/
img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
display: block;
/* 1 */
vertical-align: middle;
/* 2 */
}
/*
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
*/
img,
video {
max-width: 100%;
height: auto;
}
/* Make elements with the HTML hidden attribute stay hidden by default */
[hidden] {
display: none;
}
*, ::before, ::after {
--tw-border-spacing-x: 0;
--tw-border-spacing-y: 0;
--tw-translate-x: 0;
--tw-translate-y: 0;
--tw-rotate: 0;
--tw-skew-x: 0;
--tw-skew-y: 0;
--tw-scale-x: 1;
--tw-scale-y: 1;
--tw-pan-x: ;
--tw-pan-y: ;
--tw-pinch-zoom: ;
--tw-scroll-snap-strictness: proximity;
--tw-gradient-from-position: ;
--tw-gradient-via-position: ;
--tw-gradient-to-position: ;
--tw-ordinal: ;
--tw-slashed-zero: ;
--tw-numeric-figure: ;
--tw-numeric-spacing: ;
--tw-numeric-fraction: ;
--tw-ring-inset: ;
--tw-ring-offset-width: 0px;
--tw-ring-offset-color: #fff;
--tw-ring-color: rgb(59 130 246 / 0.5);
--tw-ring-offset-shadow: 0 0 #0000;
--tw-ring-shadow: 0 0 #0000;
--tw-shadow: 0 0 #0000;
--tw-shadow-colored: 0 0 #0000;
--tw-blur: ;
--tw-brightness: ;
--tw-contrast: ;
--tw-grayscale: ;
--tw-hue-rotate: ;
--tw-invert: ;
--tw-saturate: ;
--tw-sepia: ;
--tw-drop-shadow: ;
--tw-backdrop-blur: ;
--tw-backdrop-brightness: ;
--tw-backdrop-contrast: ;
--tw-backdrop-grayscale: ;
--tw-backdrop-hue-rotate: ;
--tw-backdrop-invert: ;
--tw-backdrop-opacity: ;
--tw-backdrop-saturate: ;
--tw-backdrop-sepia: ;
}
::backdrop {
--tw-border-spacing-x: 0;
--tw-border-spacing-y: 0;
--tw-translate-x: 0;
--tw-translate-y: 0;
--tw-rotate: 0;
--tw-skew-x: 0;
--tw-skew-y: 0;
--tw-scale-x: 1;
--tw-scale-y: 1;
--tw-pan-x: ;
--tw-pan-y: ;
--tw-pinch-zoom: ;
--tw-scroll-snap-strictness: proximity;
--tw-gradient-from-position: ;
--tw-gradient-via-position: ;
--tw-gradient-to-position: ;
--tw-ordinal: ;
--tw-slashed-zero: ;
--tw-numeric-figure: ;
--tw-numeric-spacing: ;
--tw-numeric-fraction: ;
--tw-ring-inset: ;
--tw-ring-offset-width: 0px;
--tw-ring-offset-color: #fff;
--tw-ring-color: rgb(59 130 246 / 0.5);
--tw-ring-offset-shadow: 0 0 #0000;
--tw-ring-shadow: 0 0 #0000;
--tw-shadow: 0 0 #0000;
--tw-shadow-colored: 0 0 #0000;
--tw-blur: ;
--tw-brightness: ;
--tw-contrast: ;
--tw-grayscale: ;
--tw-hue-rotate: ;
--tw-invert: ;
--tw-saturate: ;
--tw-sepia: ;
--tw-drop-shadow: ;
--tw-backdrop-blur: ;
--tw-backdrop-brightness: ;
--tw-backdrop-contrast: ;
--tw-backdrop-grayscale: ;
--tw-backdrop-hue-rotate: ;
--tw-backdrop-invert: ;
--tw-backdrop-opacity: ;
--tw-backdrop-saturate: ;
--tw-backdrop-sepia: ;
}
.mb-2 {
margin-bottom: 0.5rem;
}
.mt-4 {
margin-top: 1rem;
}
.mt-6 {
margin-top: 1.5rem;
}
.flex {
display: flex;
}
.min-h-screen {
min-height: 100vh;
}
.w-full {
width: 100%;
}
.max-w-md {
max-width: 28rem;
}
.flex-col {
flex-direction: column;
}
.items-center {
align-items: center;
}
.justify-center {
justify-content: center;
}
.space-y-4 > :not([hidden]) ~ :not([hidden]) {
--tw-space-y-reverse: 0;
margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
margin-bottom: calc(1rem * var(--tw-space-y-reverse));
}
.rounded {
border-radius: 0.25rem;
}
.border {
border-width: 1px;
}
.border-gray-300 {
--tw-border-opacity: 1;
border-color: rgb(209 213 219 / var(--tw-border-opacity));
}
.bg-blue-500 {
--tw-bg-opacity: 1;
background-color: rgb(59 130 246 / var(--tw-bg-opacity));
}
.bg-gray-50 {
--tw-bg-opacity: 1;
background-color: rgb(249 250 251 / var(--tw-bg-opacity));
}
.bg-white {
--tw-bg-opacity: 1;
background-color: rgb(255 255 255 / var(--tw-bg-opacity));
}
.p-2 {
padding: 0.5rem;
}
.p-3 {
padding: 0.75rem;
}
.p-4 {
padding: 1rem;
}
.text-center {
text-align: center;
}
.text-green-600 {
--tw-text-opacity: 1;
color: rgb(22 163 74 / var(--tw-text-opacity));
}
.text-red-500 {
--tw-text-opacity: 1;
color: rgb(239 68 68 / var(--tw-text-opacity));
}
.text-red-600 {
--tw-text-opacity: 1;
color: rgb(220 38 38 / var(--tw-text-opacity));
}
.text-white {
--tw-text-opacity: 1;
color: rgb(255 255 255 / var(--tw-text-opacity));
}
.shadow {
--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.transition {
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
transition-duration: 150ms;
}
body {
margin: 0;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
code {
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
monospace;
}
.hover\:bg-blue-600:hover {
--tw-bg-opacity: 1;
background-color: rgb(37 99 235 / var(--tw-bg-opacity));
}

40041
react-url-checker/package-lock.json generated Normal file
View File

File diff suppressed because it is too large Load Diff

51
react-url-checker/package.json Normal file
View File

@@ -0,0 +1,51 @@
{
"name": "react-url-checker",
"version": "0.1.0",
"private": true,
"dependencies": {
"@testing-library/dom": "^10.4.0",
"@testing-library/jest-dom": "^6.6.3",
"@testing-library/react": "^16.3.0",
"@testing-library/user-event": "^13.5.0",
"@types/jest": "^27.5.2",
"@types/node": "^16.18.126",
"@types/react": "^19.1.0",
"@types/react-dom": "^19.1.1",
"axios": "^1.8.4",
"react": "^19.1.0",
"react-dom": "^19.1.0",
"react-icons": "^5.5.0",
"react-scripts": "^3.0.1",
"web-vitals": "^2.1.4"
},
"scripts": {
"start": "react-scripts start --host 0.0.0.0",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"autoprefixer": "^10.4.21",
"postcss": "^8.5.3",
"tailwindcss": "^3.3.5",
"typescript": "^5.3.3"
}
}

6
react-url-checker/postcss.config.js Normal file
View File

@@ -0,0 +1,6 @@
module.exports = {
plugins: {
tailwindcss: {},
autoprefixer: {},
},
}

BIN
react-url-checker/public/favicon.ico Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.8 KiB

11
react-url-checker/public/index.html Normal file
View File

@@ -0,0 +1,11 @@
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>URL 악성 판별기</title>
</head>
<body>
<div id="root"></div>
</body>
</html>

BIN
react-url-checker/public/logo192.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.2 KiB

BIN
react-url-checker/public/logo512.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 9.4 KiB

25
react-url-checker/public/manifest.json Normal file
View File

@@ -0,0 +1,25 @@
{
"short_name": "React App",
"name": "Create React App Sample",
"icons": [
{
"src": "favicon.ico",
"sizes": "64x64 32x32 24x24 16x16",
"type": "image/x-icon"
},
{
"src": "logo192.png",
"type": "image/png",
"sizes": "192x192"
},
{
"src": "logo512.png",
"type": "image/png",
"sizes": "512x512"
}
],
"start_url": ".",
"display": "standalone",
"theme_color": "#000000",
"background_color": "#ffffff"
}

3
react-url-checker/public/robots.txt Normal file
View File

@@ -0,0 +1,3 @@
# https://www.robotstxt.org/robotstxt.html
User-agent: *
Disallow:

106
react-url-checker/src/App.css Normal file
View File

@@ -0,0 +1,106 @@
.App {
text-align: center;
}
.App-logo {
height: 40vmin;
pointer-events: none;
}
@media (prefers-reduced-motion: no-preference) {
.App-logo {
animation: App-logo-spin infinite 20s linear;
}
}
.App-header {
background-color: #282c34;
min-height: 100vh;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
font-size: calc(10px + 2vmin);
color: white;
}
.App-link {
color: #61dafb;
}
@keyframes App-logo-spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
body {
margin: 0;
font-family: 'Arial', sans-serif;
background: white;
}
.container {
height: 100vh;
width: 100vw;
max-width: 1280px;
margin: 0 auto;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.title {
font-size: 24px;
font-weight: bold;
margin-bottom: 40px;
display: flex;
align-items: center;
justify-content: center;
}
.url-form {
display: flex;
width: 500px;
background-color: #e5e5e5;
border: 1px solid #aaa;
border-radius: 5px;
box-shadow: 2px 2px 4px #ccc;
overflow: hidden;
}
.url-input {
flex: 1;
padding: 12px 16px;
border: none;
font-size: 16px;
font-weight: bold;
background-color: transparent;
outline: none;
}
.check-button {
background-color: #d6f32f;
border: none;
padding: 0 16px;
font-size: 20px;
cursor: pointer;
}
.result-box {
margin-top: 50px;
width: 600px;
background-color: #fafafa;
padding: 30px;
text-align: center;
border-radius: 5px;
}
.result-content {
margin-top: 10px;
font-size: 16px;
}

18
react-url-checker/src/App.js vendored Normal file
View File

@@ -0,0 +1,18 @@
// src/App.js
import React from "react";
import UrlPredictor from "./components/UrlPredictor";
import './App.css';
function App() {
return (
<div className="min-h-screen bg-gray-100 flex flex-col justify-center">
<div className="container mx-auto px-4 text-center">
<h1 className="text-3xl font-bold text-blue-600 mb-6">🔍 악성 URL 판별기</h1>
<UrlPredictor />
</div>
</div>
);
}
export default App;

9
react-url-checker/src/App.test.tsx Normal file
View File

@@ -0,0 +1,9 @@
import React from 'react';
import { render, screen } from '@testing-library/react';
import App from './App';
test('renders learn react link', () => {
render(<App />);
const linkElement = screen.getByText(/learn react/i);
expect(linkElement).toBeInTheDocument();
});

14
react-url-checker/src/App.tsx Normal file
View File

@@ -0,0 +1,14 @@
// App.tsx
import UrlPredictor from './components/UrlPredictor';
function App() {
return (
<div>
<h1 className="text-4xl text-red-500 font-bold">Hello Tailwind!</h1>
<h1>URL 악성 여부 판별기</h1>
<UrlPredictor />
</div>
);
}
export default App;

0
react-url-checker/src/api/predicApi.js vendored Normal file
View File

106
react-url-checker/src/components/UrlPredictor.jsx Normal file
View File

@@ -0,0 +1,106 @@
import React, { useState } from "react";
import axios from "axios";
const UrlPredictor = () => {
const [url, setUrl] = useState("");
const [results, setResults] = useState(null);
const [loading, setLoading] = useState(false);
const [error, setError] = useState("");
const handleSubmit = async (e) => {
e.preventDefault();
setLoading(true);
setError("");
setResults(null);
try {
const response = await axios.post("http://34.64.139.6:8000/predict", {
url: url,
});
setResults(response.data);
} catch (err) {
console.error(err);
setError("서버 오류가 발생했습니다.");
} finally {
setLoading(false);
}
};
// 모델 정보 정의 (title + 키)
const models = [
{ key: "old_model", title: "🧠 기존 모델 (Ho)" },
{ key: "new_model", title: "🚀 개선 모델 (Jun)" },
];
return (
<div className="min-h-screen bg-gray-100 p-6">
{!results ? (
<div className="flex justify-center items-center h-full">
<form onSubmit={handleSubmit} className="flex gap-4 w-full max-w-2xl">
<input
type="text"
value={url}
onChange={(e) => setUrl(e.target.value)}
placeholder="URL을 입력하세요"
className="flex-grow px-4 py-2 border border-gray-300 rounded shadow"
required
/>
<button
type="submit"
className="bg-blue-600 text-white px-6 py-2 rounded shadow hover:bg-blue-700 transition"
>
✅ 검사하기
</button>
</form>
</div>
) : (
<div className="grid grid-cols-2 gap-6">
{/* 좌측 입력창 */}
<div className="flex flex-col gap-4">
<form onSubmit={handleSubmit} className="flex gap-2">
<input
type="text"
value={url}
onChange={(e) => setUrl(e.target.value)}
className="flex-grow px-4 py-2 border border-gray-300 rounded shadow"
placeholder="URL을 다시 입력해보세요"
required
/>
<button
type="submit"
className="bg-blue-600 text-white px-4 py-2 rounded hover:bg-blue-700 transition"
>
다시 검사
</button>
</form>
{loading && <p>🔍 분석 중...</p>}
{error && <p className="text-red-500">❌ {error}</p>}
</div>
{/* 우측 결과 반복 렌더링 */}
<div className="flex flex-col gap-4">
{models.map((model) => {
const data = results[model.key];
return (
<div key={model.key} className="bg-white rounded p-4 shadow">
<h2 className="text-lg font-bold mb-2">{model.title}</h2>
<p>
악성 확률: <strong>{(data.prob * 100).toFixed(2)}%</strong>
</p>
<p>
판별 결과:{" "}
<strong className={data.malicious ? "text-red-600" : "text-green-600"}>
{data.malicious ? "⚠️ 악성 URL" : "✅ 정상 URL"}
</strong>
</p>
</div>
);
})}
</div>
</div>
)}
</div>
);
};
export default UrlPredictor;

18
react-url-checker/src/index.css Normal file
View File

@@ -0,0 +1,18 @@
@tailwind base;
@tailwind components;
@tailwind utilities;
body {
margin: 0;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
code {
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
monospace;
}

11
react-url-checker/src/index.js vendored Normal file
View File

@@ -0,0 +1,11 @@
import React from 'react';
import ReactDOM from 'react-dom/client';
import './index.css';
import App from './App';
const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
<React.StrictMode>
<App />
</React.StrictMode>
);

19
react-url-checker/src/index.tsx Normal file
View File

@@ -0,0 +1,19 @@
import React from 'react';
import ReactDOM from 'react-dom/client';
import './index.css';
import App from './App';
import reportWebVitals from './reportWebVitals';
const root = ReactDOM.createRoot(
document.getElementById('root') as HTMLElement
);
root.render(
<React.StrictMode>
<App />
</React.StrictMode>
);
// If you want to start measuring performance in your app, pass a function
// to log results (for example: reportWebVitals(console.log))
// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
reportWebVitals();

1
react-url-checker/src/logo.svg Normal file
View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 841.9 595.3"><g fill="#61DAFB"><path d="M666.3 296.5c0-32.5-40.7-63.3-103.1-82.4 14.4-63.6 8-114.2-20.2-130.4-6.5-3.8-14.1-5.6-22.4-5.6v22.3c4.6 0 8.3.9 11.4 2.6 13.6 7.8 19.5 37.5 14.9 75.7-1.1 9.4-2.9 19.3-5.1 29.4-19.6-4.8-41-8.5-63.5-10.9-13.5-18.5-27.5-35.3-41.6-50 32.6-30.3 63.2-46.9 84-46.9V78c-27.5 0-63.5 19.6-99.9 53.6-36.4-33.8-72.4-53.2-99.9-53.2v22.3c20.7 0 51.4 16.5 84 46.6-14 14.7-28 31.4-41.3 49.9-22.6 2.4-44 6.1-63.6 11-2.3-10-4-19.7-5.2-29-4.7-38.2 1.1-67.9 14.6-75.8 3-1.8 6.9-2.6 11.5-2.6V78.5c-8.4 0-16 1.8-22.6 5.6-28.1 16.2-34.4 66.7-19.9 130.1-62.2 19.2-102.7 49.9-102.7 82.3 0 32.5 40.7 63.3 103.1 82.4-14.4 63.6-8 114.2 20.2 130.4 6.5 3.8 14.1 5.6 22.5 5.6 27.5 0 63.5-19.6 99.9-53.6 36.4 33.8 72.4 53.2 99.9 53.2 8.4 0 16-1.8 22.6-5.6 28.1-16.2 34.4-66.7 19.9-130.1 62-19.1 102.5-49.9 102.5-82.3zm-130.2-66.7c-3.7 12.9-8.3 26.2-13.5 39.5-4.1-8-8.4-16-13.1-24-4.6-8-9.5-15.8-14.4-23.4 14.2 2.1 27.9 4.7 41 7.9zm-45.8 106.5c-7.8 13.5-15.8 26.3-24.1 38.2-14.9 1.3-30 2-45.2 2-15.1 0-30.2-.7-45-1.9-8.3-11.9-16.4-24.6-24.2-38-7.6-13.1-14.5-26.4-20.8-39.8 6.2-13.4 13.2-26.8 20.7-39.9 7.8-13.5 15.8-26.3 24.1-38.2 14.9-1.3 30-2 45.2-2 15.1 0 30.2.7 45 1.9 8.3 11.9 16.4 24.6 24.2 38 7.6 13.1 14.5 26.4 20.8 39.8-6.3 13.4-13.2 26.8-20.7 39.9zm32.3-13c5.4 13.4 10 26.8 13.8 39.8-13.1 3.2-26.9 5.9-41.2 8 4.9-7.7 9.8-15.6 14.4-23.7 4.6-8 8.9-16.1 13-24.1zM421.2 430c-9.3-9.6-18.6-20.3-27.8-32 9 .4 18.2.7 27.5.7 9.4 0 18.7-.2 27.8-.7-9 11.7-18.3 22.4-27.5 32zm-74.4-58.9c-14.2-2.1-27.9-4.7-41-7.9 3.7-12.9 8.3-26.2 13.5-39.5 4.1 8 8.4 16 13.1 24 4.7 8 9.5 15.8 14.4 23.4zM420.7 163c9.3 9.6 18.6 20.3 27.8 32-9-.4-18.2-.7-27.5-.7-9.4 0-18.7.2-27.8.7 9-11.7 18.3-22.4 27.5-32zm-74 58.9c-4.9 7.7-9.8 15.6-14.4 23.7-4.6 8-8.9 16-13 24-5.4-13.4-10-26.8-13.8-39.8 13.1-3.1 26.9-5.8 41.2-7.9zm-90.5 125.2c-35.4-15.1-58.3-34.9-58.3-50.6 0-15.7 22.9-35.6 58.3-50.6 8.6-3.7 18-7 27.7-10.1 5.7 19.6 13.2 40 22.5 60.9-9.2 20.8-16.6 41.1-22.2 60.6-9.9-3.1-19.3-6.5-28-10.2zM310 490c-13.6-7.8-19.5-37.5-14.9-75.7 1.1-9.4 2.9-19.3 5.1-29.4 19.6 4.8 41 8.5 63.5 10.9 13.5 18.5 27.5 35.3 41.6 50-32.6 30.3-63.2 46.9-84 46.9-4.5-.1-8.3-1-11.3-2.7zm237.2-76.2c4.7 38.2-1.1 67.9-14.6 75.8-3 1.8-6.9 2.6-11.5 2.6-20.7 0-51.4-16.5-84-46.6 14-14.7 28-31.4 41.3-49.9 22.6-2.4 44-6.1 63.6-11 2.3 10.1 4.1 19.8 5.2 29.1zm38.5-66.7c-8.6 3.7-18 7-27.7 10.1-5.7-19.6-13.2-40-22.5-60.9 9.2-20.8 16.6-41.1 22.2-60.6 9.9 3.1 19.3 6.5 28.1 10.2 35.4 15.1 58.3 34.9 58.3 50.6-.1 15.7-23 35.6-58.4 50.6zM320.8 78.4z"/><circle cx="420.9" cy="296.5" r="45.7"/><path d="M520.5 78.1z"/></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.6 KiB

1
react-url-checker/src/react-app-env.d.ts vendored Normal file
View File

@@ -0,0 +1 @@
/// <reference types="react-scripts" />

15
react-url-checker/src/reportWebVitals.ts Normal file
View File

@@ -0,0 +1,15 @@
import { ReportHandler } from 'web-vitals';
const reportWebVitals = (onPerfEntry?: ReportHandler) => {
if (onPerfEntry && onPerfEntry instanceof Function) {
import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
getCLS(onPerfEntry);
getFID(onPerfEntry);
getFCP(onPerfEntry);
getLCP(onPerfEntry);
getTTFB(onPerfEntry);
});
}
};
export default reportWebVitals;

5
react-url-checker/src/setupTests.ts Normal file
View File

@@ -0,0 +1,5 @@
// jest-dom adds custom jest matchers for asserting on DOM nodes.
// allows you to do things like:
// expect(element).toHaveTextContent(/react/i)
// learn more: https://github.com/testing-library/jest-dom
import '@testing-library/jest-dom';

0
react-url-checker/src/styles/main.css Normal file
View File

10
react-url-checker/tailwind.config.js Normal file
View File

@@ -0,0 +1,10 @@
/** @type {import('tailwindcss').Config} */
module.exports = {
content: [
"./src/**/*.{js,jsx,ts,tsx}", // 이 부분이 중요!
],
theme: {
extend: {},
},
plugins: [],
}

26
react-url-checker/tsconfig.json Normal file
View File

@@ -0,0 +1,26 @@
{
"compilerOptions": {
"target": "es5",
"lib": [
"dom",
"dom.iterable",
"esnext"
],
"allowJs": true,
"skipLibCheck": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"strict": true,
"forceConsistentCasingInFileNames": true,
"noFallthroughCasesInSwitch": true,
"module": "esnext",
"moduleResolution": "node",
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": true,
"jsx": "preserve"
},
"include": [
"src"
]
}