Skip to content

Instantly share code, notes, and snippets.

View KrustyC's full-sized avatar
💻
Coding

Davide Crestini KrustyC

💻
Coding
View GitHub Profile
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>My First React App</title>
</head>
<body>
export function App() {
return (
<div>
<h2>My first React Todo App</h2>
</div>
);
}
import ReactDom from "react-dom";
import { App } from "./App";
ReactDom.render(<App />, document.getElementById("root"));
{
"presets": [
"@babel/preset-env",
[
"@babel/preset-react",
{
"runtime": "automatic"
}
]
]
@KrustyC
KrustyC / webpack.config.js
Created May 9, 2021 11:48
App Js File for React Medium tutorial
const path = require("path");
const HtmlWebpackPlugin = require("html-webpack-plugin");
module.exports = {
output: {
path: path.join(__dirname, "/dist"), // Files will be sent here once they are bundled
filename: "index_bundle.js", // name of the bundle generated by Webpack
},
// webpack 5 comes with devServer which loads in development mode
devServer: {
import { PHONE_SIZE } from '../constants';
type Dimensions = {
width: number;
height: number;
};
type DimensionData = {
mediaDimensions: Dimensions;
containerDimensions: Dimensions;
const getNewDimensions = (playerInstance: jwplayer.JWPlayer | null): Dimension => {
const container = playerInstance.getContainer();
const parentContainerWidth = container && container.parentElement.offsetWidth;
let parentContainerHeight = container && container.parentElement.offsetHeight;
// get the window size, overcoming simulator bug of misplacing the actual screen size property value
const windowWidth = Math.min(window.innerWidth, window.outerWidth);
console.log(windowWidth)
import * as React from 'react';
import PropTypes from 'prop-types';
import { JWPlayerProps, JWPlayerInstance } from './types';
import useJWPlayer from './hooks/useJWPlayer';
import useScript from './hooks/useScript';
const ReactJWPlayer = React.forwardRef((props: JWPlayerProps, ref?: JWPlayerInstance) => {
const { isScriptLoaded, isError } = useScript(props.playerId);
const { playerInstance, playerElement } = useJWPlayer(props, isScriptLoaded);