上級者の説明からこぼれ落ちる細部
身の程知らずな挑戦を続ける独学者にとって大変なのは、
説明の内容が難しいのではなく、
説明してくれていないところがわからない、ということだ。
Full Stack Dartを目指すServerpod、
Serverpod自体の説明は丁寧なので、がんばればついて行ける。
けれども、これ使うほどのエンジニアなら当然知ってるでしょ、ということは説明してくれない。
それで立ち往生する。
どこにもいけない
SeverpodのAuthenticationはなかなか親切で、
（他は知らないので、特別なわけではないかもしれないが）
いろんな機能（詳しくはわからない）がセットになったmoduleを入れさえすれば
様々なことをよしなに取り計らってくれる、らしい。
E-mailやGoogleでのログインボタンなんかも、もれなくついてくる。
例えばSignInWithEmailButton()をクリックすると
入力画面が開いて、いろいろ入力すればsignUp完了、DBにちゃんとuserとして登録される。
おお、簡単。
ところが、そこから、うんともすんとも動かない。
user感覚が抜けないので、signUpしたら次に進めよ、と思ってしまうが、進まない。
えーいと思ってやり直すと、
「もうsignInしてますね」という感じでいきなりAccountPageに入る、
のだが、ここからもどこへも行けない。
ここにはsignOutというButtonがあるので、それを押すと、
terminalではサインアウトしたと表示されるけど、これもどこへも行かない。
考えてみたら当たり前のことで、
ここから先は、それぞれのアプリで挙動が違うだろう。
どこへ行くかは勝手に決めてよね、ということだ。
ここまでが親切すぎたので、油断した･･･。
まずはsignUp signInしたときの遷移。
Padding(
padding: const EdgeInsets.all(8.0),
child: SignInWithEmailButton(
caller: client.modules.auth,
///ここから先がtutorialにはなかったので追加。
onSignedIn: () {
Navigator.push<String>(
context,
MaterialPageRoute(
builder: (context) => const AccountPage(),
),
);
},
),
),
つぎはsignOutしたときの遷移
Padding(
padding: const EdgeInsets.all(16),
child: ElevatedButton(
onPressed: () {
sessionManager.signOut();
///ここから先がtutorialになかったので追加。
Navigator.push<String>(
context,
MaterialPageRoute(
builder: (context) => const SignInPage(),
),
);
},
child: const Text('Sign out'),
),
),
signInしたまま先に進むには
FloatingActionButtonをつけました。ふつうのButtonでもいいかもね。
ちなみにAccountPageで遭遇したもう一つの問題
tutorialで、
AccountPageというfileをつくって、これを貼り付けてね、
といわれるコードを貼り付けると、
「いきなりListViewとかいうな！」と怒られます。
tutorialのcodeはこんな感じ
import 'package:flutter/material.dart';
import 'package:serverpod_auth_shared_flutter/serverpod_auth_shared_flutter.dart';
import 'package:my_project_flutter/src/serverpod_client.dart';
class AccountPage extends StatelessWidget {
const AccountPage({Key? key}) : super(key: key);
Widget build(BuildContext context) {
return ListView(
children: [
ListTile(
contentPadding:
const EdgeInsets.symmetric(vertical: 8, horizontal: 16),
leading: CircularUserImage(
userInfo: sessionManager.signedInUser,
size: 42,
),
title: Text(sessionManager.signedInUser!.userName),
subtitle: Text(sessionManager.signedInUser!.email ?? ''),
),
Padding(
padding: const EdgeInsets.all(16),
child: ElevatedButton(
onPressed: () {
sessionManager.signOut();
},
child: const Text('Sign out'),
),
),
],
);
}
}
ListViewをScaffoldでwrapしたら動きました。
知らないって、悲しい。
でも、一つ一つわかっていくのは楽しいです。
今回はこの記事にそって挑戦中。
clearしたら、またご報告します。
Discussion