thiscodeWorks - Saving, organizing & sharing the best of code online

Instead of reading the table twice, we only need to read it once and can return one set of results. This query also has the same 30046 logical reads.

PIVOT 

Learn how to use Pivot to do this

#sql

Union will merge the data

@darshcode

https://www.simplilearn.com/tutorials/sql-tutorial/sql-union

#sql

Using CTE with Counts

@darshcode

WITH cte1 AS(
 SELECT COUNT(*) cnt 
 FROM table1
 WHERE....
), cte2 AS(
 SELECT COUNT(*) cnt
 FROM table1
 WHERE....
), cte3 AS(
 SELECT COUNT(*) cnt
 FROM table 1
 WHERE....
)
SELECT cte1.cnt AS cte1, cte2.cnt AS cte2, cte3.cnt AS cte3
FROM cte1, cte2, cte3

SELECT
  (SELECT COUNT(*) FROM table1 WHERE....) as cte1,
  (SELECT COUNT(*) FROM table1 WHERE....) as cte2,
  (SELECT COUNT(*) FROM table1 WHERE....) as cte3

Download GitHub directory

@abcabcabc

https://download-directory.github.io/

#javascript

The Pitfalls of Async/Await in JavaScript

@devbymohsin

https://blog.bitsrc.io/pitfalls-of-async-await-in-javascript-7c0678fbc282

#grid #subgrid

subgrid

@linabalciunaite

https://web.dev/articles/css-subgrid

Create Expanding Image Gallery

@im_haider

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <style>
        body {
            margin: 0;
            font-family: 'Arial', sans-serif;
        }

        .gallery {
            display: flex;
            justify-content: space-around;
            align-items: center;
            margin-top: 20px;
        }

        .image-container {
            overflow: hidden;
            width: 200px; /* Initial small width */
            transition: width 0.3s;
        }

        .image-container img {
            width: 100%;
            height: auto;
        }

        .image-container:hover {
            width: 300px; /* Expanded width on hover */
        }
    </style>
    <title>Expandable Image Gallery</title>
</head>
<body>

<div class="gallery">
    <div class="image-container" onmouseover="expandImage(this)" onmouseout="shrinkImage(this)">
        <img src="https://i.ibb.co/hVhHwwB/Untitled-design-30.png" alt="Image 1">
    </div>
    <div class="image-container" onmouseover="expandImage(this)" onmouseout="shrinkImage(this)">
        <img src="https://i.ibb.co/D9gvWV3/Untitled-design-29.png" alt="Image 2">
    </div>
<div class="image-container" onmouseover="expandImage(this)" onmouseout="shrinkImage(this)">
        <img src="https://i.ibb.co/hVhHwwB/Untitled-design-30.png" alt="Image 1">
    </div>
    <div class="image-container" onmouseover="expandImage(this)" onmouseout="shrinkImage(this)">
        <img src="https://i.ibb.co/D9gvWV3/Untitled-design-29.png" alt="Image 2">
    </div>
    <!-- Add more image containers as needed -->
</div>

<script>
    function expandImage(element) {
        element.style.width = "300px";
    }

    function shrinkImage(element) {
        element.style.width = "100px";
    }
</script>

</body>
</html>

리눅스 환경변수 영구 적용

@wheedo

export JAVA_HOME=[/usr/java/jdk1.6.0_45] <- 여기에 경로 설정

image

@dsce

import java.awt.*;
import java.awt.event.*;
import javax.swing.*;
import javax.swing.event.*;
import javax.swing.colorchooser.*;
public class ColorChooserDemo
{   private JFrame frame;
	private JColorChooser cc;
	private JButton b;
     
	public ColorChooserDemo()
	{
		frame = new JFrame("A Sample Frame");
		frame.setSize(700, 500);
		
		cc = new JColorChooser(); frame.add(cc);
		
		b = new JButton("Color Changer");
		b.addActionListener(new ActionListener(){
			public void actionPerformed(ActionEvent ae)
			{ frame.getContentPane().setBackground(cc.getColor()); }
		});
		frame.add(b);		
				
		frame.setLayout(new FlowLayout());
           frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
	    frame.setVisible(true);
	}
	
	public static void main(String[] args)
	{  	new ColorChooserDemo(); 	}
}

Button demo

@dsce

import java.awt.*;
import java.awt.event.*;
import javax.swing.*;

public class ButtonDemo  
{   private JFrame frame;
    private JLabel label;
	private JButton b1, b2; 
	
	public ButtonDemo()
	{
		frame = new JFrame("A Simple Swing App");

		Toolkit tk = frame.getToolkit();
		Dimension dim = tk.getScreenSize();
		int width = (int)dim.getWidth();
		int height = (int)dim.getHeight();
		frame.setSize(width, height);
		
		frame.setLayout(new FlowLayout());	
		
		label = new JLabel("I show the button text");
		label.setFont(new Font("Verdana", Font.BOLD, 18));	
		frame.add(label);
		
		b1 = new JButton("The First Button");
		b1.setFont(new Font("Verdana", Font.BOLD, 18));
		frame.add(b1);
		b1.addActionListener(new ActionListener(){
			public void actionPerformed(ActionEvent ae)
			{   label.setText(b1.getText()+" is pressed!"); 	}
		});
		
		b2 = new JButton("The Second Button");
		b2.setFont(new Font("Verdana", Font.BOLD, 18));
		frame.add(b2);
		b2.addActionListener(new ActionListener(){
			public void actionPerformed(ActionEvent ae)
			{   label.setText(b2.getText()+" is pressed!"); 	}
		});
				
		frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
		frame.setVisible(true);
	}
	
	public static void main(String[] args)
	{   new ButtonDemo();
	}
}

limage icon

@dsce

import java.awt.*;
import java.awt.event.*;
import javax .swing.*;
public class LabelDemo{
	private JFrame frame;
	private JLabel label;
	public LabelDemo(){
		frame=new JFrame("a simple swing app");
		Toolkit tk=frame.getToolkit();
		Dimension dim=tk.getScreenSize();
		int width=(int)dim.getWidth();
		int height=(int)dim.getHeight();
		frame.setSize(width,height);
		
		frame.setLayout(new FlowLayout());
		
		ImageIcon ic= new ImageIcon("giphy.gif"); 
		
		label=new JLabel("A Shining planet",ic,JLabel.CENTER);
		label.setFont(new Font("Verdana",Font.BOLD,18));
		label.setBackground(Color.blue);
		frame.add(label);
		
		frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
		frame.setVisible(true);
		
		
	}
	public static void main(String[] args){
		new LabelDemo();
	}
}

Color Chooser

@dsce

import java.awt.*;
import java.awt.event.*;
import javax.swing.*;
import javax.swing.event.*;
import javax.swing.colorchooser.*;

public class ColorChooserDemo
{   private JFrame frame;
	private JColorChooser cc;
	private JButton b;
     
	public ColorChooserDemo()
	{
		frame = new JFrame("A Sample Frame");
		frame.setSize(700, 500);
		
		cc = new JColorChooser(); frame.add(cc);
		
		b = new JButton("Color Changer");
		b.addActionListener(new ActionListener(){
			public void actionPerformed(ActionEvent ae)
			{ frame.getContentPane().setBackground(cc.getColor()); }
		});
		frame.add(b);		
				
		frame.setLayout(new FlowLayout());
           frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
	    frame.setVisible(true);
	}
	
	public static void main(String[] args)
	{  	new ColorChooserDemo(); 	}
}

#ubuntu

https 자동으로 다시 갱신하게 만드는 명령어

@wheedo

sudo certbot renew --dry-run

#ubuntu

우분투 메모리 확보 명령어

@wheedo

sync && echo 3 > /proc/sys/vm/drop_caches

#apache2

apache2 오류인 부분 알려주는 명령어

@wheedo

apache2ctl configtest

counting pagination jquery for slick slider

@nofil

jQuery(".homeSlider").slick({
customPaging: function (slick, index) {
        // Add leading zero for single-digit slide numbers
        var slideNumber = (index + 1 < 10) ? '0' + (index + 1) : (index + 1);

        // Remove the zero after count 9
        slideNumber = (index + 1 === 10) ? '' + (index + 1) : slideNumber;

        return "<a>" + slideNumber + "</a>";
    },
  });

Complex Objects Mutation

@Marcelluki

const [array, setArray] = React.useState(['One', 'Two', 'Three']);

// this is not the correct way!
array.push('Four');
setArray(array); 

// this is the right way
setArray([...array, 'Four']);

useState hook (Destructuring examples)

@Marcelluki

const [rating, setRating] = React.useState(0); // -1, 0 or 1
const [isBlocked, setIsBlocked] = React.useState(false); // true or false
const [notes, setNotes] = React.useState(['no notes yet']); // an array of strings

useState hooks (Functional Component)

@Marcelluki

// the User functional component
function User(props) {
  // the hook that manages internal state
  const [rating, setRating] = React.useState(0);

  /*
   * event handlers to update internal state
   */
  function handleLike() {
    setRating(1);
  }

  function handleDislike() {
    setRating(-1);
  }

  return (
    <div className="user">
      <img src={`img/${props.id}.png`} width="75" />
      {props.name}
      <div className="rating">
        <button onClick={handleLike} disabled={rating > 0}>👍</button>
        {rating}
        <button onClick={handleDislike} disabled={rating < 0}>👎</button>
      </div>
    </div>
  );
}

React commands

@Marcelluki

npm run dev - runs development project

npm run build -runs build project that is able to be streamed to the internet

React Navabar link to sections and smooth scroll

@eziokittu

I want to use React to Scroll to Specific Section of my Website, but the navbar, pages all are different .js files

ChatGPT
To implement scrolling to specific sections of your website using React, even when the components are in different files, you can use the react-scroll library. This library provides a smooth scrolling experience between different sections of your webpage.

Here are the steps to achieve this:

npm install react-scroll

// Navbar.js
import React from 'react';
import { Link, animateScroll as scroll } from 'react-scroll';

const Navbar = () => {
  return (
    <nav>
      <ul>
        <li>
          <Link
            activeClass="active"
            to="home"
            spy={true}
            offset={-70}
            duration={1500}
			smooth={'easeOutElastic'}
          >
            Home
          </Link>
        </li>
        <li>
          <Link
            activeClass="active"
            to="about"
            spy={true}
            offset={-70}
            duration={1500}
			smooth={'easeOutElastic'}
          >
            About
          </Link>
        </li>
        {/* Add more links for other sections */}
      </ul>
    </nav>
  );
};

export default Navbar;



// Home.js
import React from 'react';

const Home = () => {
  return (
    <div id="home">
      <h1>Home Section</h1>
      {/* Add content for the home section */}
    </div>
  );
};

export default Home;



// App.js
import React from 'react';
import Navbar from './Navbar';
import Home from './Home';
import About from './About';
// Import other section components

const App = () => {
  return (
    <div>
      <Navbar />
      <Home />
      <About />
      {/* Render other section components */}
    </div>
  );
};

export default App;


Now, when you click on the navigation links in the Navbar, the page will smoothly scroll to the corresponding sections. Make sure to customize the content of each section and adjust the Link components in the Navbar accordingly.

Accessing form values (React)

@Marcelluki

// InfoForm.js

this.state = {
  submitted: false,
  userEmail: '', // we'll start this off as an empty string
}; 

//We can attach the onChange listener to our <input> element. This will be triggered every time a change is made inside our input. For example, if the user enters the string, 'pillow' inside of our input, onChange() will fire 6 times, one for each character inside the string.

// InfoForm.js

<input onChange={this.handleChange} className="infoForm-input" type="email" placeholder="Enter your email here"/> 
  
//Finally, we'll need to create the handleChange() method itself:
  
// InfoForm.js

handleChange = (evt) => {
  this.setState({ userEmail: evt.target.value });
};

#sql

Date

@darshcode

// Date with time
GETDATE()
// Just the year
YEAR(GETDATE())
// Date without the time
CAST( GETDATE() AS Date )

Importing basic form component (React)

@Marcelluki

// InfoForm.js

import React from "react";
import "./InfoForm.css";

class InfoForm extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      submitted: false,
    };
  }

  handleSubmit = () => {
    this.setState({ submitted: true });
  };

  render() {
    if (this.state.submitted) {
      return (
        <p className="infoForm-text">
          Thanks. When the kingdom of comfort opens, we'll be in touch!
        </p>
      );
    } else {
      return (
        <div className="infoForm-container">
          <p className="infoForm-text">
            Sign up below and we'll let you know when we launch the next great
            mattress experience!
          </p>
          <form onSubmit={this.handleSubmit} className="infoForm-form">
            <input
              className="infoForm-input"
              type="email"
              placeholder={"Enter your email here"}
            />
            <button className="infoForm-button" type="submit">
              Amaze me!
            </button>
          </form>
        </div>
      );
    }
  }
}

export default InfoForm;

Importing Fonts

@Marcelluki

/* Header.css */

@font-face {
    font-family: 'Roboto Condensed';
    src: url('../../fonts/Robotocondensed.woff') format('woff');
}

.header-title {
    text-align: center;
    color: #fff;
    font-size: 40px;
    font-family: 'Roboto Condensed', sans-serif;
    max-width: 220px;
    margin: 0 auto 58px;
    text-transform: uppercase;
}

#sql

For Finding Schema_Table_Column

@darshcode

select * from information_schema.columns 
where TABLE_SCHEMA ='SCE' and TABLE_NAME like'%Order%' and COLUMN_NAME like'%Order%'

select * from information_schema.columns 
WHERE TABLE_SCHEMA ='SCE' and TABLE_NAME like'vw_ORDERS_1' and COLUMN_NAME like'%Date%'

link to install plugin wordpress

@Shira

https://sydneyharbourboattours.com/wp-admin/plugin-install.php

#javascript

Bootstrap html snippet. Update user profile

@PhobiaCide

<style>
body{
background:#f9f9fb;    
}
.view-account{
background:#FFFFFF; 
margin-top:20px;
}
.view-account .pro-label {
font-size: 13px;
padding: 4px 5px;
position: relative;
top: -5px;
margin-left: 10px;
display: inline-block
}

.view-account .side-bar {
padding-bottom: 30px
}

.view-account .side-bar .user-info {
text-align: center;
margin-bottom: 15px;
padding: 30px;
color: #616670;
border-bottom: 1px solid #f3f3f3
}

.view-account .side-bar .user-info .img-profile {
width: 120px;
height: 120px;
margin-bottom: 15px
}

.view-account .side-bar .user-info .meta li {
margin-bottom: 10px
}

.view-account .side-bar .user-info .meta li span {
display: inline-block;
width: 100px;
margin-right: 5px;
text-align: right
}

.view-account .side-bar .user-info .meta li a {
color: #616670
}

.view-account .side-bar .user-info .meta li.activity {
color: #a2a6af
}

.view-account .side-bar .side-menu {
text-align: center
}

.view-account .side-bar .side-menu .nav {
display: inline-block;
margin: 0 auto
}

.view-account .side-bar .side-menu .nav>li {
font-size: 14px;
margin-bottom: 0;
border-bottom: none;
display: inline-block;
float: left;
margin-right: 15px;
margin-bottom: 15px
}

.view-account .side-bar .side-menu .nav>li:last-child {
margin-right: 0
}

.view-account .side-bar .side-menu .nav>li>a {
display: inline-block;
color: #9499a3;
padding: 5px;
border-bottom: 2px solid transparent
}

.view-account .side-bar .side-menu .nav>li>a:hover {
color: #616670;
background: none
}

.view-account .side-bar .side-menu .nav>li.active a {
color: #40babd;
border-bottom: 2px solid #40babd;
background: none;
border-right: none
}

.theme-2 .view-account .side-bar .side-menu .nav>li.active a {
color: #6dbd63;
border-bottom-color: #6dbd63
}

.theme-3 .view-account .side-bar .side-menu .nav>li.active a {
color: #497cb1;
border-bottom-color: #497cb1
}

.theme-4 .view-account .side-bar .side-menu .nav>li.active a {
color: #ec6952;
border-bottom-color: #ec6952
}

.view-account .side-bar .side-menu .nav>li .icon {
display: block;
font-size: 24px;
margin-bottom: 5px
}

.view-account .content-panel {
padding: 30px
}

.view-account .content-panel .title {
margin-bottom: 15px;
margin-top: 0;
font-size: 18px
}

.view-account .content-panel .fieldset-title {
padding-bottom: 15px;
border-bottom: 1px solid #eaeaf1;
margin-bottom: 30px;
color: #616670;
font-size: 16px
}

.view-account .content-panel .avatar .figure img {
float: right;
width: 64px
}

.view-account .content-panel .content-header-wrapper {
position: relative;
margin-bottom: 30px
}

.view-account .content-panel .content-header-wrapper .actions {
position: absolute;
right: 0;
top: 0
}

.view-account .content-panel .content-utilities {
position: relative;
margin-bottom: 30px
}

.view-account .content-panel .content-utilities .btn-group {
margin-right: 5px;
margin-bottom: 15px
}

.view-account .content-panel .content-utilities .fa {
font-size: 16px;
margin-right: 0
}

.view-account .content-panel .content-utilities .page-nav {
position: absolute;
right: 0;
top: 0
}

.view-account .content-panel .content-utilities .page-nav .btn-group {
margin-bottom: 0
}

.view-account .content-panel .content-utilities .page-nav .indicator {
color: #a2a6af;
margin-right: 5px;
display: inline-block
}

.view-account .content-panel .mails-wrapper .mail-item {
position: relative;
padding: 10px;
border-bottom: 1px solid #f3f3f3;
color: #616670;
overflow: hidden
}

.view-account .content-panel .mails-wrapper .mail-item>div {
float: left
}

.view-account .content-panel .mails-wrapper .mail-item .icheck {
background-color: #fff
}

.view-account .content-panel .mails-wrapper .mail-item:hover {
background: #f9f9fb
}

.view-account .content-panel .mails-wrapper .mail-item:nth-child(even) {
background: #fcfcfd
}

.view-account .content-panel .mails-wrapper .mail-item:nth-child(even):hover {
background: #f9f9fb
}

.view-account .content-panel .mails-wrapper .mail-item a {
color: #616670
}

.view-account .content-panel .mails-wrapper .mail-item a:hover {
color: #494d55;
text-decoration: none
}

.view-account .content-panel .mails-wrapper .mail-item .checkbox-container,
.view-account .content-panel .mails-wrapper .mail-item .star-container {
display: inline-block;
margin-right: 5px
}

.view-account .content-panel .mails-wrapper .mail-item .star-container .fa {
color: #a2a6af;
font-size: 16px;
vertical-align: middle
}

.view-account .content-panel .mails-wrapper .mail-item .star-container .fa.fa-star {
color: #f2b542
}

.view-account .content-panel .mails-wrapper .mail-item .star-container .fa:hover {
color: #868c97
}

.view-account .content-panel .mails-wrapper .mail-item .mail-to {
display: inline-block;
margin-right: 5px;
min-width: 120px
}

.view-account .content-panel .mails-wrapper .mail-item .mail-subject {
display: inline-block;
margin-right: 5px
}

.view-account .content-panel .mails-wrapper .mail-item .mail-subject .label {
margin-right: 5px
}

.view-account .content-panel .mails-wrapper .mail-item .mail-subject .label:last-child {
margin-right: 10px
}

.view-account .content-panel .mails-wrapper .mail-item .mail-subject .label a,
.view-account .content-panel .mails-wrapper .mail-item .mail-subject .label a:hover {
color: #fff
}

.view-account .content-panel .mails-wrapper .mail-item .mail-subject .label-color-1 {
background: #f77b6b
}

.view-account .content-panel .mails-wrapper .mail-item .mail-subject .label-color-2 {
background: #58bbee
}

.view-account .content-panel .mails-wrapper .mail-item .mail-subject .label-color-3 {
background: #f8a13f
}

.view-account .content-panel .mails-wrapper .mail-item .mail-subject .label-color-4 {
background: #ea5395
}

.view-account .content-panel .mails-wrapper .mail-item .mail-subject .label-color-5 {
background: #8a40a7
}

.view-account .content-panel .mails-wrapper .mail-item .time-container {
display: inline-block;
position: absolute;
right: 10px;
top: 10px;
color: #a2a6af;
text-align: left
}

.view-account .content-panel .mails-wrapper .mail-item .time-container .attachment-container {
display: inline-block;
color: #a2a6af;
margin-right: 5px
}

.view-account .content-panel .mails-wrapper .mail-item .time-container .time {
display: inline-block;
text-align: right
}

.view-account .content-panel .mails-wrapper .mail-item .time-container .time.today {
font-weight: 700;
color: #494d55
}

.drive-wrapper {
padding: 15px;
background: #f5f5f5;
overflow: hidden
}

.drive-wrapper .drive-item {
width: 130px;
margin-right: 15px;
display: inline-block;
float: left
}

.drive-wrapper .drive-item:hover {
box-shadow: 0 1px 5px rgba(0, 0, 0, .1);
z-index: 1
}

.drive-wrapper .drive-item-inner {
padding: 15px
}

.drive-wrapper .drive-item-title {
margin-bottom: 15px;
max-width: 100px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis
}

.drive-wrapper .drive-item-title a {
color: #494d55
}

.drive-wrapper .drive-item-title a:hover {
color: #40babd
}

.theme-2 .drive-wrapper .drive-item-title a:hover {
color: #6dbd63
}

.theme-3 .drive-wrapper .drive-item-title a:hover {
color: #497cb1
}

.theme-4 .drive-wrapper .drive-item-title a:hover {
color: #ec6952
}

.drive-wrapper .drive-item-thumb {
width: 100px;
height: 80px;
margin: 0 auto;
color: #616670
}

.drive-wrapper .drive-item-thumb a {
-webkit-opacity: .8;
-moz-opacity: .8;
opacity: .8
}

.drive-wrapper .drive-item-thumb a:hover {
-webkit-opacity: 1;
-moz-opacity: 1;
opacity: 1
}

.drive-wrapper .drive-item-thumb .fa {
display: inline-block;
font-size: 36px;
margin: 0 auto;
margin-top: 20px
}

.drive-wrapper .drive-item-footer .utilities {
margin-bottom: 0
}

.drive-wrapper .drive-item-footer .utilities li:last-child {
padding-right: 0
}

.drive-list-view .name {
width: 60%
}

.drive-list-view .name.truncate {
max-width: 100px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis
}

.drive-list-view .type {
width: 15px
}

.drive-list-view .date,
.drive-list-view .size {
max-width: 60px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis
}

.drive-list-view a {
color: #494d55
}

.drive-list-view a:hover {
color: #40babd
}

.theme-2 .drive-list-view a:hover {
color: #6dbd63
}

.theme-3 .drive-list-view a:hover {
color: #497cb1
}

.theme-4 .drive-list-view a:hover {
color: #ec6952
}

.drive-list-view td.date,
.drive-list-view td.size {
color: #a2a6af
}

@media (max-width:767px) {
.view-account .content-panel .title {
    text-align: center
}
.view-account .side-bar .user-info {
    padding: 0
}
.view-account .side-bar .user-info .img-profile {
    width: 60px;
    height: 60px
}
.view-account .side-bar .user-info .meta li {
    margin-bottom: 5px
}
.view-account .content-panel .content-header-wrapper .actions {
    position: static;
    margin-bottom: 30px
}
.view-account .content-panel {
    padding: 0
}
.view-account .content-panel .content-utilities .page-nav {
    position: static;
    margin-bottom: 15px
}
.drive-wrapper .drive-item {
    width: 100px;
    margin-right: 5px;
    float: none
}
.drive-wrapper .drive-item-thumb {
    width: auto;
    height: 54px
}
.drive-wrapper .drive-item-thumb .fa {
    font-size: 24px;
    padding-top: 0
}
.view-account .content-panel .avatar .figure img {
    float: none;
    margin-bottom: 15px
}
.view-account .file-uploader {
    margin-bottom: 15px
}
.view-account .mail-subject {
    max-width: 100px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}
.view-account .content-panel .mails-wrapper .mail-item .time-container {
    position: static
}
.view-account .content-panel .mails-wrapper .mail-item .time-container .time {
    width: auto;
    text-align: left
}
}

@media (min-width:768px) {
.view-account .side-bar .user-info {
    padding: 0;
    padding-bottom: 15px
}
.view-account .mail-subject .subject {
    max-width: 200px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}
}

@media (min-width:992px) {
.view-account .content-panel {
    min-height: 800px;
    border-left: 1px solid #f3f3f7;
    margin-left: 200px
}
.view-account .mail-subject .subject {
    max-width: 280px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}
.view-account .side-bar {
    position: absolute;
    width: 200px;
    min-height: 600px
}
.view-account .side-bar .user-info {
    margin-bottom: 0;
    border-bottom: none;
    padding: 30px
}
.view-account .side-bar .user-info .img-profile {
    width: 120px;
    height: 120px
}
.view-account .side-bar .side-menu {
    text-align: left
}
.view-account .side-bar .side-menu .nav {
    display: block
}
.view-account .side-bar .side-menu .nav>li {
    display: block;
    float: none;
    font-size: 14px;
    border-bottom: 1px solid #f3f3f7;
    margin-right: 0;
    margin-bottom: 0
}
.view-account .side-bar .side-menu .nav>li>a {
    display: block;
    color: #9499a3;
    padding: 10px 15px;
    padding-left: 30px
}
.view-account .side-bar .side-menu .nav>li>a:hover {
    background: #f9f9fb
}
.view-account .side-bar .side-menu .nav>li.active a {
    background: #f9f9fb;
    border-right: 4px solid #40babd;
    border-bottom: none
}
.theme-2 .view-account .side-bar .side-menu .nav>li.active a {
    border-right-color: #6dbd63
}
.theme-3 .view-account .side-bar .side-menu .nav>li.active a {
    border-right-color: #497cb1
}
.theme-4 .view-account .side-bar .side-menu .nav>li.active a {
    border-right-color: #ec6952
}
.view-account .side-bar .side-menu .nav>li .icon {
    font-size: 24px;
    vertical-align: middle;
    text-align: center;
    width: 40px;
    display: inline-block
}
}
</style>

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet">
<div class="container">
    <div class="view-account">
        <section class="module">
            <div class="module-inner">
                <div class="side-bar">
                    <div class="user-info">
                        <img class="img-profile img-circle img-responsive center-block" src="https://bootdey.com/img/Content/avatar/avatar1.png" alt="">
                        <ul class="meta list list-unstyled">
                            <li class="name">Rebecca Sanders
                                <label class="label label-info">UX Designer</label>
                            </li>
                            <li class="email"><a href="#">Rebecca.S@website.com</a></li>
                            <li class="activity">Last logged in: Today at 2:18pm</li>
                        </ul>
                    </div>
            		<nav class="side-menu">
        				<ul class="nav">
        					<li class="active"><a href="#"><span class="fa fa-user"></span> Profile</a></li>
        					<li><a href="#"><span class="fa fa-cog"></span> Settings</a></li>
        					<li><a href="#"><span class="fa fa-credit-card"></span> Billing</a></li>
        					<li><a href="#"><span class="fa fa-envelope"></span> Messages</a></li>
        					
        					<li><a href="user-drive.html"><span class="fa fa-th"></span> Drive</a></li>
        					<li><a href="#"><span class="fa fa-clock-o"></span> Reminders</a></li>
        				</ul>
        			</nav>
                </div>
                <div class="content-panel">
                    <h2 class="title">Profile<span class="pro-label label label-warning">PRO</span></h2>
                    <form class="form-horizontal">
                        <fieldset class="fieldset">
                            <h3 class="fieldset-title">Personal Info</h3>
                            <div class="form-group avatar">
                                <figure class="figure col-md-2 col-sm-3 col-xs-12">
                                    <img class="img-rounded img-responsive" src="https://bootdey.com/img/Content/avatar/avatar1.png" alt="">
                                </figure>
                                <div class="form-inline col-md-10 col-sm-9 col-xs-12">
                                    <input type="file" class="file-uploader pull-left">
                                    <button type="submit" class="btn btn-sm btn-default-alt pull-left">Update Image</button>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-md-2 col-sm-3 col-xs-12 control-label">User Name</label>
                                <div class="col-md-10 col-sm-9 col-xs-12">
                                    <input type="text" class="form-control" value="Rebecca">
                                </div>
                            </div>
        
                            <div class="form-group">
                                <label class="col-md-2 col-sm-3 col-xs-12 control-label">First Name</label>
                                <div class="col-md-10 col-sm-9 col-xs-12">
                                    <input type="text" class="form-control" value="Rebecca">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-md-2 col-sm-3 col-xs-12 control-label">Last Name</label>
                                <div class="col-md-10 col-sm-9 col-xs-12">
                                    <input type="text" class="form-control" value="Sanders">
                                </div>
                            </div>
                        </fieldset>
                        <fieldset class="fieldset">
                            <h3 class="fieldset-title">Contact Info</h3>
                            <div class="form-group">
                                <label class="col-md-2  col-sm-3 col-xs-12 control-label">Email</label>
                                <div class="col-md-10 col-sm-9 col-xs-12">
                                    <input type="email" class="form-control" value="Rebecca@website.com">
                                    <p class="help-block">This is the email </p>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-md-2  col-sm-3 col-xs-12 control-label">Twitter</label>
                                <div class="col-md-10 col-sm-9 col-xs-12">
                                    <input type="text" class="form-control" value="SpeedyBecky">
                                    <p class="help-block">Your twitter username</p>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-md-2  col-sm-3 col-xs-12 control-label">Linkedin</label>
                                <div class="col-md-10 col-sm-9 col-xs-12">
                                    <input type="url" class="form-control" value="https://www.linkedin.com/in/lorem">
                                    <p class="help-block">eg. https://www.linkedin.com/in/yourname</p>
                                </div>
                            </div>
                        </fieldset>
                        <hr>
                        <div class="form-group">
                            <div class="col-md-10 col-sm-9 col-xs-12 col-md-push-2 col-sm-push-3 col-xs-push-0">
                                <input class="btn btn-primary" type="submit" value="Update Profile">
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </section>
    </div>
</div>

Using Lenis with NextJS 13 · Issue #170 · studio-freight/lenis

@vishalbhan

"use client";
import Lenis from "@studio-freight/lenis";
import { useEffect } from "react";

export const LenisScroller = () => {
  useEffect(() => {
    const lenis = new Lenis();

    lenis.on("scroll", (e: any) => {
       console.log(e);
     });

    function raf(time: number) {
      lenis.raf(time);
      requestAnimationFrame(raf);
    }

    requestAnimationFrame(raf);

    return () => {
      lenis.destroy();
    };
  }, []);

  return <></>;
};

#sql

Search for Objects ( Example Code )

@darshcode

USE [AdventureWorks];
GO
SELECT name AS [Name], 
       SCHEMA_NAME(schema_id) AS schema_name, 
       type_desc, 
       create_date, 
       modify_date
FROM sys.objects
WHERE type ='u'

#sql

Gives you all the Information Schema

@darshcode

SELECT catalog_name AS DBName, 
    Schema_name, 
    schema_owner
FROM information_schema.SCHEMATA;

#sql

Query to find Views from

@darshcode

SELECT * from INFORMATION_SCHEMA.VIEWS

Build Your Own Blockchain Network - Get Started Now!

@jonathandaveiam

https://www.addustechnologies.com/blog/build-your-own-blockchain-network

BOOKS

@Fahrine

import java.util.ArrayList;
import java.util.Scanner;

public class LibrarySystem {

    private static ArrayList<Book> books = new ArrayList<>();
    private static Scanner scanner = new Scanner(System.in);

    public static void main(String[] args) {
        while (true) {
            displayMenu();
            int choice = scanner.nextInt();
            scanner.nextLine(); // Consume the newline character

            switch (choice) {
                case 1:
                    addBook();
                    break;
                case 2:
                    viewBookList();
                    break;
                case 3:
                    searchBook();
                    break;
                case 4:
                    System.out.println("Exiting program. Goodbye!");
                    System.exit(0);
                default:
                    System.out.println("Invalid choice. Please try again.");
            }
        }
    }

    private static void displayMenu() {
        System.out.println("Library System Menu:");
        System.out.println("1. Add Book");
        System.out.println("2. View Book List");
        System.out.println("3. Search for Book");
        System.out.println("4. Exit");
        System.out.print("Enter your choice: ");
    }

    private static void addBook() {
        System.out.print("Enter book title: ");
        String title = scanner.nextLine();

        System.out.print("Enter author: ");
        String author = scanner.nextLine();

        books.add(new Book(title, author));
        System.out.println("Book added successfully!");
    }

    private static void viewBookList() {
        if (books.isEmpty()) {
            System.out.println("No books in the library yet.");
        } else {
            System.out.println("Book List:");
            for (Book book : books) {
                System.out.println("Title: " + book.getTitle() + ", Author: " + book.getAuthor());
            }
        }
    }

    private static void searchBook() {
        System.out.print("Enter book title to search: ");
        String searchTitle = scanner.nextLine();

        boolean found = false;
        for (Book book : books) {
            if (book.getTitle().equalsIgnoreCase(searchTitle)) {
                System.out.println("Book found: Title: " + book.getTitle() + ", Author: " + book.getAuthor());
                found = true;
                break;
            }
        }

        if (!found) {
            System.out.println("Book with title '" + searchTitle + "' not found.");
        }
    }

    private static class Book {
        private String title;
        private String author;

        public Book(String title, String author) {
            this.title = title;
            this.author = author;
        }

        public String getTitle() {
            return title;
        }

        public String getAuthor() {
            return author;
        }
    }
}

Perimeters with a Catch // Edabit

@msagr

function perimeter(l, num){
	let dict = new Object();
	dict = {
		's' : 4*num,
		'c' : 2*num*3.14,
	};
	return dict[l] || undefined;
}

Find Number of Digits in Number // Edabit

@msagr

function num_of_digits(num) {
	let cnt = 1;
	num = Math.abs(num);
	num = Math.floor(num/10);
	while(num != 0){
		cnt = cnt+1;
		num = Math.floor(num/10);
	}
	return cnt;
}

#ms.pbi #dax #dax.ranks #dax.all #ranking

DAX | Rank Sales Rep based on Total Sales

@nikahafiz

Sales Rep Rank =

RANKX(
	ALL( Sales[Sales Rep]),
	[Total Sales],
	Dense
)

//Dense = not skip

Roots of Quadratic equations

@python

import java.util.Scanner;
public class RootsOfDemo {
    public static void main(String[] args) {
        Scanner sc = new Scanner(System.in);

        double det,root1,root2;

        System.out.println("ENTER THE VALUES OF a,b,and c :");

        int a = sc.nextInt();
        int b = sc.nextInt();
        int c = sc.nextInt();

        det = (b*b)- 4*a*c;

        if(det>0){
            System.out.println("Roots are Real and Distinct ");
            root1 = (-b) + Math.sqrt(det)/(2*a);
            root2 = (-b) - Math.sqrt(det)/(2*a);
            System.out.println("The Roots are : "+ root1 + root2);
        }

        else if(det==0){
            System.out.println("Roots are Real and Equal ");
            root1 = -b/2*a;
            System.out.println("The Roots are : "+ root1 + root1);
        }

        else{
            System.out.println("Roots are Imaginary ");
            double img = Math.sqrt(det*-1)/2*a;
            //System.out.println("The real part is "+ -b/2*a +" The imaginary part is "+ ( Math.sqrt(det*-1)/2*a ) +"i" );
            System.out.println("The img roots are "+ -b/2*a +"+"+ img + "i");
            System.out.println("The img roots are "+ -b/2*a +"-"+ img + "i");
        }


    }
    
}

#ms.pbi #dax #table

DAX | Create Table - 2

@nikahafiz

Table =

{
	("Nik", 101),
	("Hafiz", 102),
}

#ms.pbi #dax #dax.datatable #dax.integer #dax.string #table

DAX | Create Table - 1

@nikahafiz

Table =

DATATABLE(
	"SNo", INTEGER,
	"Name", STRING,
	{
		{101, "Nik"},
		{102, "Hafiz"},
	}
)

tailwind class to apply box shadow animation

@eziokittu

shadow-[0_0_5px_black] hover:shadow-[0_0_15px_black] transition duration-500

Get Variable from URL

@abhikash01

var storeName = HttpUtility.ParseQueryString(urlAddress).Get("storeName");

Use Session in .NET Core MVC

@abhikash01

Add following Code in Program.CS :
     builder.Services.AddSession(options =>
     {
         options.IdleTimeout = TimeSpan.FromMinutes(30);
     });
app.UseSession();

In Controller use the following Code: 
To get the Session:
 HttpContext.Session.SetString("Name", "John Smith");

To set the Session:
 ViewBag.Name = HttpContext.Session.GetString(sessionName);

Отметки из журнала: Клименко Егор Александрович · I полугодие — Электронный журнал — МБОУ «Технический лицей при СГУГиТ» — г. Новосибирск

@segaplay15

https://school.nso.ru/journal-student-grades-action/u.561

1

@segaplay15

#ms.pbi #dax #dax.topn #ranking #dax.format #dax.concatenatex

DAX | Best Selling Day/Date - 2

@nikahafiz

Best Selling Day/Date =

CONCATENATEX(
	TOPN(
		1,
		'Calendar',
		[Total Sales]
		),
	FORMAT( 'Calendar'[Date], "dd-mmm" )
	)

Use Db Context in Controller:

@abhikash01

 private readonly dbContext _context;

 public MonthReportsController(dbContext context)
 {
     _context = context;
 }

#ms.pbi #dax #dax.topn #ranking #dax.values

DAX | Best Selling Product

@nikahafiz

Top Selling Product =

TOPN(
	1,
	VALUES( Sales[ProductID] ),
	[Total Sales]
)

#ms.pbi #dax #dax.topn #ranking

DAX | Best Selling Day/Date - 1

@nikahafiz

Best Selling Day/Date =

TOPN(
	1,
	'Calendar',
	[Total Sales]
)

Change Password Policy in .NET Core Identity

@abhikash01

In Program.Cs add following Code: 

Builder.services.Configure<IdentityOptions>(options => 
{     
    options.Password.RequireDigit = true; 
    options.Password.RequireLowercase = true; 
    options.Password.RequireNonAlphanumeric = true; 
    options.Password.RequireUppercase = true; 
    options.Password.RequiredLength = 6; 
    options.Password.RequiredUniqueChars = 1; 
});

Multiple Counts in One Query

Union will merge the data

Using CTE with Counts

Download GitHub directory

The Pitfalls of Async/Await in JavaScript

subgrid

Create Expanding Image Gallery

리눅스 환경변수 영구 적용

image

Button demo

limage icon

Color Chooser

https 자동으로 다시 갱신하게 만드는 명령어

우분투 메모리 확보 명령어

apache2 오류인 부분 알려주는 명령어

counting pagination jquery for slick slider

Complex Objects Mutation

useState hook (Destructuring examples)

useState hooks (Functional Component)

React commands

React Navabar link to sections and smooth scroll

Accessing form values (React)

Date

Importing basic form component (React)

Importing Fonts

For Finding Schema_Table_Column

link to install plugin wordpress

Bootstrap html snippet. Update user profile

Using Lenis with NextJS 13 · Issue #170 · studio-freight/lenis

Search for Objects ( Example Code )

Gives you all the Information Schema

Query to find Views from

Build Your Own Blockchain Network - Get Started Now!

BOOKS

Perimeters with a Catch // Edabit

Find Number of Digits in Number // Edabit

DAX | Rank Sales Rep based on Total Sales

Roots of Quadratic equations

DAX | Create Table - 2

DAX | Create Table - 1

tailwind class to apply box shadow animation

Get Variable from URL

Use Session in .NET Core MVC

Отметки из журнала: Клименко Егор Александрович · I полугодие — Электронный журнал — МБОУ «Технический лицей при СГУГиТ» — г. Новосибирск

1

DAX | Best Selling Day/Date - 2

Use Db Context in Controller:

DAX | Best Selling Product

DAX | Best Selling Day/Date - 1

Change Password Policy in .NET Core Identity

Save snippets that work with our extensions