Vercel

Introduction GakuNin RDM is a research data management platform provided by the National Institute of Informatics (NII). It is built on the Open Science Framework (OSF) and allows automation of project operations through its API. In this article, I introduce how to perform the following operations using the GakuNin RDM API from Node.js. Project creation and configuration Wiki creation and updating Adding members GitHub integration + automatic deployment with Vercel Prerequisites Obtaining a Personal Access Token Log in to GakuNin RDM Navigate to Settings > Personal Access Tokens Create a new token (scopes: osf.full_read, osf.full_write) Project Initialization m n n k p p d m m i r i i n n r i s d t t m a - l & y l & d c o d t e r n d v m Save the token in a .env file. ...

Introduction When I tried to deploy a Next.js application to Vercel, I encountered a problem where the build succeeded locally but failed on Vercel. The error message was vague, and it was difficult to identify the cause. In this article, I share the process from discovering the problem to resolving it, along with what I learned about JavaScript operator precedence. Symptoms Error Message E [ T r E h r r e o r r o s r p o : e c c c A i u n f r i r e c e r d r m o e p r s r s e o a r c g e c e n u d r i e r s r e i d o n m g i i n t p t a t e g h d e e i " S n / e e r p n r / e o s r d m u e C c l o t l m i s p o / o n 2 n 2 e b - n u 0 t i 3 s l " d r s e n t d o e r a . v o i d l e a k i n g s e n s i t i v e d e t a i l s . ] Characteristic Behavior Local build succeeds, but Vercel build fails Errors occur on different pages each time (22-03, 24-03, 25-04, etc.) Error details are hidden in production builds Finding the Cause While investigating multiple files, I discovered the following code pattern: ...

Overview This is a memo on how to handle CORS for Express deployed on Vercel using vercel.json. Background I implemented CORS handling for the program introduced in the following article. The following was used as a reference. https://vercel.com/guides/how-to-enable-cors Method The solution is as follows. While there may be other approaches, adding headers resolved the issue. https://github.com/nakamura196/dts-typescript/commit/4c28f66b2af68950656dcb812f3e941d1b9b5feb { } " " ] " ] " ] " ] v b , r , r , h e u { } e { } e { } e { } r i w d a s l " " r " " i " " " d " " ] i d s u i s d r s d p e s h o s r s t o e e o e e r o e { { { } { } n " c e e u s c u s r s u a , " : " " s r t t r t m " r d " " " " " " : : : " c i s c i a : c e k k k v k v [ : e n " e n n e r e e e a e a 2 " " " a : " a e [ " s y y y l y l , s @ [ : t : t n : " " " " u " u r v i [ i t : : : : e : e c e " " " " " " / r n n : / [ " " " : " : i c a " " " a A A A A n e p : , : t p c c c " c " d l i r i c c c G c X e / / " " u / e e e E e - x n d / / e ( s s s T s C . o t s a . s s s , s S t d s r p * - - - O - R s e ( c i ) C C C P C F " " . / " o o o T o - , i d , n n n I n T ) n t t t t O t o " d s r r r N r k , e " o o o S o e x , l l l , l n . - - - P - , t A A A A A s l l l T l X " l l l C l - o o o H o R w w w , w e - - - D - q C O M E H u r r e L e e e i t E a s d g h T d t e i o E e e n n d , r d t " s P s - i , " O " W a , S , i l " T t s v , h " a P , , l U u T A " e " c v " c a : e l p u " t e * , " " : A } c " , c t e r p u t e - " V e } r , s i o n , C o n t e n t - L e n g t h , C o n t e n t - M D 5 , C o n t e n t - T y p e , D a t e , X - A p i - V e r s i o n " Summary I hope this serves as a helpful reference. ...

Overview I added a route registration feature to the “Rekichizu x Next.js” site. Below is a display example. References The “Rekichizu x Next.js” site is introduced in the following article. As a precedent for displaying routes using “Rekichizu”, the following example exists. https://codh.rois.ac.jp/edomi/route/ This time, I added a route creation feature based on the above example. Usage Access the site. https://rekichizu-next.vercel.app/ja/ Click “Manage My Routes”. Login is required, so log in using the button in the upper right. ...

Overview I created a sample repository for using clover-iiif with Next.js, so here are my notes. https://clover-iiif-demo.vercel.app/ Background clover-iiif is described as follows. https://github.com/samvera-labs/clover-iiif Extensible IIIF front-end toolkit and Manifest viewer. Accessible. Composable. Open Source. We will use this with Next.js. Data “Koui Genji Monogatari (held by the National Diet Library)” is used as sample data. https://dl.ndl.go.jp/pid/3437686 Repository It is published at the following link. https://github.com/nakamura196/clover-iiif-demo I referenced the following. ...

Overview The “Historiographical Institute Database Variant Character Identification List” is published on the following page. https://wwwap.hi.u-tokyo.ac.jp/ships/itaiji_list.jsp This time, I will create an API to retrieve the data published on the above page in JSON format. What Was Developed You can access it from the following URL. https://hi-itaiji.vercel.app/ It returns a mapping using “char (variant character)” from the identification list as the key and the “base” kanji as the value. Summary I hope this serves as a useful reference for applying variant character lists. ...

Overview I looked into how to use the Zotero API from Next.js, so this is a memo. As a result, I created the following application. https://zotero-rouge.vercel.app/ Library I used the following library. https://github.com/tnajdek/zotero-api-client Getting the API Key and Other Information Please refer to the following article. Usage Collection List i i i i i a ) } m m m m m s p p p p p y z z { c c r a o o o o o n o o o o e p r r r r r c t t n n t p t t t t t e e s s u / f r r t t r a { a { { { u o o n p p n A U m c i N i p d g c p s y o c / e r e e t i e a l o z x f i c t i K r p l l o t r s r S o e I i e l t R o m y e n y d c e e e m a p s : : = t c r s t s f i t o p " } i e s s a o i / o z } o t t t p n o c n o f n c r r i s n o s t r f h i i ( R s l e e o r } Z n n z e R l r m o o g g o s e e } o m f t , t p s c - " r e e o p t f a @ " o r r n o i r p / . m o o s n o o i l . C A e s n m - i / " o p e s c b . @ l i = . / " l . a l K r r n i p / u e e a a o e e r p t c y w w u x n i o h t ) a ; t t t s s 0 i . i e " m t / o l t . s ; a s n n i j e " / e s b m s r ; e x ( r y v n t a a e c j r p r r s y i " y - ( . ; p a " c t u u o i t s l o h e l n 0 r e " " " c ; ; , t i z o o n t s e ( r ) o . U g s e e t r ( I ) d ; ) ; Specific Collection i i i i i a ) } m m m m m s p p p p p y z z c { c c r a o o o o o n o o o o o e p r r r r r c t t l n n t p t t t t t e e l s s u / f r r e t t r a { a { { { u o o c n p p n A U t m c i N i p d g c p s i y o c / e r e e t i e o a l o z x f i c t i K r n p l l o t r s r S o e I I i e l t R o m y e n y d d c e e e m a p s : : : = t c r s t s f i t o p " } i e s s s a o i / o z } o t t t t p n o c n o f n c r r r i R n o s t r f h i i i ( e R l e e o r } Z n n n z s e l r m o o g g g o p s e } o m f t , , t o p c - " r e e n o t f a @ " o r r s n i r p / @ m o o e s o o i l / C A e n m - i a " o p = . / c b p @ l i r [ " l / p a l K a a i n i p / u e e w w d e e r a t c y a ; ] x n i p h t ) i / t t s i 0 i . t r " m / / o l s ; a p n n i m u e " o e ( b y t r ; s x r a e v t t a p . e s j r i t r / s y . s " e - ( c ; n a " o c u u l r t s l y h e e p 0 r c t " " t i ; , i o o n z n " o s ; t ( e c r o o l U l s e e c r t I i d o ) n ; I d ) . g e t ( ) ; List of Items in a Specific Collection i i i i i a ) m m m m m s p p p p p y z z c { c c r a o o o o o n o o o o o e p r r r r r c t t l n n . . . t p t t t t t e e l s s c i g u / f r r e t t o t e r a { a { { { u o o c l e t n p p n A U t m c l m ( i N i p d g c p s i y o e s ) c / e r e e t i e o a l c ( ; o z x f i c t i K r n p l t ) l o t r s r S o e I I i e i l t R o m y e n y d d c o e e e m a p s : : : = t n c r s t s f i s t o p " } i e s s s a o ( i / o z } o t t t t p n c o c n o f n c r r r i R o n o s t r f h i i i ( e l R l e e o r } Z n n n z s l e l , r m o o g g g o p e s e o m f t , , t o c p c N - " r e e n t o t e a @ " o r r s i n i x p / @ m o o e o s o t i l / C A n e n R - i a " o p = I . / e c b p @ l i d r [ q l / p a l K a ) a i u i p / u e e w w d e e r a t c y a ; ] s n i p h t ) i / t t s i 0 i . t i " m / / o l t } ; a p n n i m e " o e ( b y m f ; s x r a s r t t a p / o s j r i r m / s y o e - ( u " n a " t n c u u e e r t s . x y h e t t p 0 r s / t " " s i ; , e o r n z v " o e ; t r e " r ; o U s e r I d ) ; References The application is hosted on Vercel, using Vercel Postgres for the database and Prisma as the ORM. The UI was built with Tailwind CSS, using design suggestions from ChatGPT. Auth0 was adopted for authentication. ...

Overview These are notes on creating a DTS (Distributed Text Services) API for TEI/XML files published by the Koui Genji Monogatari Text DB. Background The Koui Genji Monogatari Text DB is available at: https://kouigenjimonogatari.github.io/ It publishes TEI/XML files. Developed DTS The developed DTS is available at: https://dts-typescript.vercel.app/api/dts It uses Express.js deployed on Vercel. For more information about DTS, please refer to: MyCapytain Library In the following article, I introduced a library for using DTS from Python: ...

Overview This is a memo on how to customize Ramp. As a result of customization, the UI is partially localized to Japanese, with the media player and metadata/transcription displayed side by side. Additionally, the query parameter t can be used to specify the playback start time for audio. For example, playback starting from the 140-second mark can be accessed from the following URL. https://ramp-iiif.vercel.app/?iiif-content=https://nakamura196.github.io/ramp_data/demo/3571280/manifest.json&t=140 Below is the pre-customization state. ...

Overview I prepared a demo page where you can try the Mirador 3 annotations plugin with an IIIF manifest specified via URL parameters. https://mirador-annotations.vercel.app/ By using the iiif-content or manifest parameter, you can target a specified IIIF manifest. https://mirador-annotations.vercel.app/?iiif-content=https://dl.ndl.go.jp/api/iiif/1301543/manifest.json This article is a memo about creating this demo page. Background There is an annotation plugin for Mirador 3 called mirador-annotations. https://github.com/ProjectMirador/mirador-annotations I introduced usage examples in the following article. A demo page is already available at the following link, but it does not provide the ability to specify an IIIF manifest file via URL parameters. ...

I had the opportunity to host Nuxt 3 SSR on Vercel, so this is a note for reference. For the build settings, I needed to set the Output Directory to .output/server as follows. For enabling CORS, the following article was helpful. https://vercel.com/guides/how-to-enable-cors Specifically, I was able to handle this by placing the following file at the root of the project. { } " ] h e { } a d " " ] e s h r o e { { { { s u a " r d " " " " : c e k k k k e r e e e e [ " s y y y y : " " " " " : : : : : " / [ " " " " a A A A A p c c c c i c c c c / e e e e ( s s s s . s s s s * - - - - ) C C C C " o o o o , n n n n t t t t r r r r o o o o l l l l - - - - A A A A l l l l l l l l o o o o w w w w - - - - C O M H r r e e e i t a d g h d e i o e n n d r t " s s i , " " a , , l " s v " " " a v v , l a a u l l " e u u v " e e a : " " l : : u " e * " " " " G X : E - } T C " , , S t O R r P F u T - e I T " O o N k } S e , , n P , A T X C - H R , e D q E u L e E s T t E e , d P - O W S i T t , h P , U T A " c c } e , p t , A c c e p t - V e r s i o n , C o n t e n t - L e n g t h , C o n t e n t - M D 5 , C o n t e n t - T y p e , D a t e , X - A p i - V e r s i o n " } There may be incorrect descriptions, but I hope this is helpful. ...