home scroll deno

deno learning blog May 2023

May 8, 2023

Data Tables

https://deno.land/x/html_table@v1.0.0
https://stackdiary.com/guides/create-table-javascript/
https://linuxhint.com/add-row-to-html-table-using-javascript/
https://shopify.engineering/building-data-table-component-react
https://stackoverflow.com/questions/49665450/appending-a-new-html-element-inside-existing-div-in-react-js
https://stackoverflow.com/questions/22876978/loop-inside-react-jsx
https://stackoverflow.com/questions/36905536/how-to-iterate-through-key-value-pair-in-javascript-if-i-dont-know-key-name
https://stackoverflow.com/questions/57086672/element-implicitly-has-an-any-type-because-expression-of-type-string-cant-b
https://effectivetypescript.com/2020/05/26/iterate-objects/

Create divs from array in React-type framework

export default function Body() {
return (
<div>
<table class=" border-2">
{
[1, 2, 3, 4, 5, 6].map((value, index) => {
return <div key={index}>{value}</div>
})
}
</table>
</div>
)
}

Create a table in React-type framework

export default function Body() {
return (
<div>
<table class=" border-2">
{
[1, 2, 3, 4, 5, 6].map((value, index) => {
return <tr key={index}>{value}
<td>cell content</td>
<td>{value}</td>
</tr>
})
}
</table>
</div>
)

May 9, 2023

The data for the table are stored in an array of objects:
dataArray=
[
{ key1: value1, key2: value2, ..etc.}
{ key1: value1, key2: value2, ..etc.}
{ key1: value1, key2: value2, ..etc.}
]
The problem with accessing the data in transcript is that the type of the key is not known:
This code
for (const data of dataArray) {
const keys = Object.keys(data);
for (const key of keys) {
console.log(data[key]);
leads to the error
Element implicitly has an 'any' type because expression of type 'string' can't be used to index type
Solution:
for (const data of dataArray) {
const someObj = data;
const keys = Object.keys(data);
for (const key of keys) {
const temp = someObj[key as keyof typeof someObj]
}
from
https://stackoverflow.com/questions/57086672/element-implicitly-has-an-any-type-because-expression-of-type-string-cant-b/69198602#69198602
tailwind table styles
https://freefrontend.com/tailwind-tables/
https://www.tailwindtoolbox.com/components/responsive-table

Get the values out of the data object via map function:
https://www.tutorialspoint.com/how-to-use-my-object-like-an-array-using-map-function-in-javascript

May 12, 2023

Creating a module for deno

Error on import statement:
An import path can only end with a '.tsx' extension when 'allowImportingTsExtensions' is enabled.ts(5097)
https://stackoverflow.com/questions/67975313/tsconfig-require-file-extension-in-imports-deno

deno module for datatable registered!

module

Date

New Card

Follow Me

discord