SQL Script to Backup all SQL Server Databases Backup all databases on your server using T-SQL is a much simpler and faster. Below T-SQL script will generate backup of all databases with date stamp in backup file name. Update the backup path in below script. DECLARE @dbname NVARCHAR(256) DECLARE @filepath NVARCHAR(512) DECLARE @fileName NVARCHAR(512) DECLARE @Date NVARCHAR(40) -- Database backup directory SET @filepath = 'D:\backup\' -- filename format SELECT @Date = CONVERT(NVARCHAR(20),GETDATE(),110) DECLARE backup_cursor CURSOR READ_ONLY FOR SELECT name FROM master.sys.databases WHERE name NOT IN ('master','model','msdb','tempdb') -- exclude system databases AND state = 0 -- Online database AND is_in_standby = 0 -- database is not read only for log shipping OPEN backup_cursor FETCH NEXT FROM backup_cursor INTO @dbname WHILE @@FETCH_STATUS = 0 BEGIN SET @fileName = @filepath + @dbname + '_' + @Date + '.bak' BACKUP DATABASE @dbname TO DISK = @fileName WITH INIT FETCH NEXT FROM backup_cursor INTO @dbname END CLOSE backup_cursor DEALLOCATE backup_cursor

Why does adding useState result in a white screen in my react app?

Fayyazuddin

The code below works completely fine and results in the image below.

import React from "react";
import "./App.css";
import { useState } from "react";

function App(){
    return(
        <body>
            <div className="nav_bar">
                <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"></link>
                <ul className="top">
                    <div className="circle circle1">
                        <li className="material-icons noselect">
                            drag_handle
                        </li>
                    </div>
                    <div className="circle circle2">
                        <li className="material-icons noselect">
                            home
                        </li>
                    </div>
                    <div className="circle circle3">
                        <li className="material-icons noselect">
                            person_outline
                        </li>
                    </div>
                </ul>
                <nav>
                    <ul className="bottom">
                        <li className="material-icons noselect" id="feed-bottom">
                            drag_handle
                        </li>
                        <li className="material-icons noselect" id="home-bottom">
                            home
                        </li>
                        <li className="material-icons noselect" id="profile-bottom">
                            person_outline
                        </li>
                    </ul>
                </nav>
            </div>
        </body>
    ); 
}

export default App;

Result

Adding useState to get and set the current state causes the navbar to disappear and show a completely white screen. Specifically I am using useState to change the icon shown in the nav bar to text and to set the currernt state to the icon that is clicked. Code Below

import React from "react";
import "./App.css";
import { useState } from "react";

function App(){
    const[selected, setselected] = useState('home');
    if(selected === 'feed'){
        const feed = document.getElementById('feed-bottom');
        feed.innerHTML = 'FEED';
    } else if (selected === 'profile') {
        const profile = document.getElementById('profile-bottom');
        profile.innerHTML = 'PROFILE';
    }else{
        const home = document.getElementById('home-bottom');
        home.innerHTML = 'HOME';
    }
    return(
        <body>
            <div className="nav_bar">
                <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"></link>
                <ul className="top">
                    <div className="circle circle1">
                        <li className="material-icons noselect">
                            drag_handle
                        </li>
                    </div>
                    <div className="circle circle2">
                        <li className="material-icons noselect">
                            home
                        </li>
                    </div>
                    <div className="circle circle3">
                        <li className="material-icons noselect">
                            person_outline
                        </li>
                    </div>
                </ul>
                <nav>
                    <ul className="bottom">
                        <li className="material-icons noselect" id="feed-bottom" onClick={setselected('profile')}>
                            drag_handle
                        </li>
                        <li className="material-icons noselect" id="home-bottom" onClick={setselected('home')}>
                            home
                        </li>
                        <li className="material-icons noselect" id="profile-bottom" onClick={setselected('profile')}>
                            person_outline
                        </li>
                    </ul>
                </nav>
            </div>
        </body>
    ); 
}

export default App;

I've looked up many post that refernece similar issues but couldn't find one that pretained to mine. I would grealty appreciate some assitance.