Next JS
1. belajar next js routing
https://mzaky.medium.com/tutorial-nextjs-1-menginstall-dan-mengenal-routing-di-nextjs-2da136370bd5
2. form chakra ui
https://codesandbox.io/s/next-js-11-jwt-authentication-example-5lhh1?from-embed=&file=/helpers/api/jwt-middleware.js
3. Connect mysql next js
https://www.youtube.com/watch?v=nnyGB5wSh7Y
4. jsonwebtoken
https://medium.com/swlh/jwt-json-web-tokens-user-authentication-in-next-js-web-application-51deab8f2e96
5. json web token
https://mfikri.com/artikel/login-jwt-express-react-mysql
6. cara push router
https://nextjs.org/docs/api-reference/next/router
7. menggunakan .env
https://github.com/dotenv-org/examples/blob/master/dotenv-esm/index.mjs
8. membuat cookies di next js
https://stackoverflow.com/questions/57559239/cant-set-a-cookie-using-nextjs-9s-api-route
9. membuat sidebar
https://www.youtube.com/watch?v=mN3P_rv8ad4'
10. install stayled next js
https://medium.com/nerd-for-tech/using-next-js-with-styled-components-easy-dfff3849e4f1
11. tailwind table
https://codepen.io/superfly/pen/wvvPLZB
12. responsive navigate taillwind
https://www.youtube.com/watch?v=wUMrXQaCj0Y
13. horizontal align tailwind
https://www.codegrepper.com/code-examples/whatever/horizontal+align+tailwind
14. push tambah array & objct
https://bobbyhadz.com/blog/react-push-to-state-array
15. fix erro localstorage
https://developer.school/snippets/react/localstorage-is-not-defined-nextjs
16. set max parse uploads
https://tpiros.dev/blog/uploading-and-displaying-videos-with-nextjs/
17. upload menggunakan multer
https://stackoverflow.com/questions/41429355/multer-dynamic-destination-path
18. upload backend react
https://www.filestack.com/fileschool/react/react-file-upload/#:~:text=In%20order%20to%20upload%20files,%3A%2F%2Flocalhost%3A3000%2FuploadFile.
19. view img
https://nextjs.org/docs/basic-features/static-file-serving
20. replace spasi pada upload file
https://flaviocopes.com/how-to-replace-whitespace-javascript/
theString = theString.replace(/%20/g, "")21. next env
https://stackoverflow.com/questions/67240908/how-to-set-base-url-based-on-environment-variable-in-next-js
22. path name
https://stackoverflow.com/questions/58022046/get-url-pathname-in-nextjs
23. iron session
https://github.com/vvo/iron-session/tree/a6c767d425c52575f743e86b64b8b4a4ce64add6/examples/next.js
24. sort table
https://codesandbox.io/embed/table-sorting-example-ur2z9?fontsize=14&hidenavigation=1&theme=dark
25. next js capasitor
https://devdactic.com/nextjs-and-capacitor
https://www.youtube.com/watch?v=xQKtDgJXrlM&t=770s
26. mengatasi toast keluar double
https://stackoverflow.com/questions/62578112/react-toastify-showing-multiple-toast
27. ubah data ke select di next js
const dataToko = [ { id: 1, name: "Toko A", location: "Jakarta" }, { id: 2, name: "Toko B", location: "Bandung" }, { id: 3, name: "Toko C", location: "Surabaya" } ]; const options = dataToko.map((toko) => ({ value: toko.location.toLowerCase(), label: toko.location }));
28. membuat select dan dapat di pilih
import React, { useState } from "react"; import Select from "react-select"; const options = [ { value: "chocolate", label: "Chocolate" }, { value: "strawberry", label: "Strawberry" }, { value: "vanilla", label: "Vanilla" } ]; function App() { const [selectedOption, setSelectedOption] = useState(null); const handleChange = (option) => { setSelectedOption(option); }; return ( <div> <Select value={selectedOption} onChange={handleChange} options={options} /> <p>Selected value: {selectedOption ? selectedOption.label : "None"}</p> </div> ); } export default App;
29. google sign
https://blog.logrocket.com/guide-adding-google-login-react-app/
30. next js 14 + mysql + api
https://medium.com/@cat.3st3ban/mysql-with-nextjs-14-94c2c76b1e24
https://www.youtube.com/watch?v=gEB3ckYeZF4
Komentar
Posting Komentar