README.md

@@ -6,11 +6,8 @@ Front page of [yude.jp](https://yude.jp).\
 Built with [Next.js](https://nextjs.org/) and [Tailwind CSS](https://tailwindcss.com/) and deployed on [Vercel](https://vercel.com).
 
 ## Development
-### Setup
+* To setup your repository, please run `yarn`.
-1. Run `yarn`.
+* To preview, please run `yarn dev`.
-1. Rename `.env.local.sample` as `.env.local` and set value. 
-### Preview
-* Run `yarn dev`.
 
 ## License
 This repository is licensed under the MIT License.

pages/components/DiscordPlaying.js

@@ -7,25 +7,27 @@ function App (){
   const router = useRouter()
   const { locale, locales, defaultLocale, pathname } = router
   const { t, lang } = useTranslation("common")
-  const [dataPlaying, setDataPlaying] = useState({ hits: [] });
+  const [data, setData] = useState({ hits: [] });
   useEffect(async () => {
     const result = await axios(
       'https://discord.com/api/guilds/723409709306216498/widget.json',
     );
 
-    setDataPlaying(result.dataPlaying);
+    setData(result.data);
     }, []);
-  if (dataPlaying === undefined){
+  if (data === undefined){
     console.log("[Discord API] データの取得に失敗しました。 / Failed to retrieve data.")
     return <p></p>
   }else{
-  const str = JSON.stringify(dataPlaying)
+  const str = JSON.stringify(data)
   
   if (str.indexOf("game") !== -1){
-  const yes_playing = t('yes_playing', {playing: dataPlaying.members[0].game.name})
+  const yes_playing = t('yes_playing', {playing: data.members[0].game.name})
   return <p>{yes_playing}</p>
+  console.log("[Discord API] Playing: " + data.members[0].game.name)
   }else{
   return <p></p>
+  console.log("[Discord API] Nothing playing")
   }
 }
 };

pages/components/DiscordStatus.js

@@ -8,7 +8,10 @@ const App = () => {
       .then((r) => r.json())
       .then((j) => setStatus(j.members[0].status))
   }, []);
-
+  if (status === undefined){
+  console.log("[Discord API] オンライン状態を取得できませんでした。 / Failed to retrieve online status.")
+  return <div></div>
+  }else{
   if (status === "online") {
     return <div className="font-bold text-gray-700 rounded-full bg-green-500 flex w-5 h-5 items-center justify-center"></div>
   }else{
@@ -23,5 +26,6 @@ const App = () => {
     }
   }
 };
+}
 
 export default App;

pages/components/Spotify.js

@@ -7,21 +7,21 @@ function App () {
   const router = useRouter()
   const { locale, locales, defaultLocale, pathname } = router
   const { t, lang } = useTranslation("common")  
-  const [dataSpotify, setDataSpotify] = useState({ hits: [] });
+  const [data, setData] = useState({ hits: [] });
   useEffect(async () => {
     const result = await axios(
       '/api/Spotify',
     );
 
-    setDataSpotify(result.dataSpotify);
+    setData(result.data);
     }, []);
 
-  if (dataSpotify === undefined){
+  if (data === undefined){
     console.log("[Spotify Web API] データの取得に失敗しました。 / Failed to retrieve data.")
     return <p></p>
   }else{
-  if (dataSpotify.isPlaying){
+  if (data.isPlaying){
-   const status = dataSpotify.artist + ' / ' + dataSpotify.title
+   const status = data.artist + ' / ' + data.title
    const listening = t('listening', {listening: status})
    return <p>{listening}</p>
   }else{

pages/profile.js

@@ -55,11 +55,9 @@ export default function About(props) {
         />
         
           <p className="text-4xl subpixel-antialiased">yude</p>
-          <div>
           <DiscordPlaying />
           <Spotify />
           </div>
-          </div>
         </div>
         
         {