Вчера вечером я играл со своим шаблонным кодом Blockstack React и другими приложениями Blockstack и заметил одну вещь. Все приложения Blockstack будут иметь кнопку Войти с помощью Blockstack на своих страницах, но простого плагина для добавления этого нет.
Недавно я попытался написать Node SDK, PHP SDK и Python SDK для одного из моих побочных проектов и обнаружил, что это отличный опыт обучения. Я хотел попробовать сделать то же самое с React. После сообщения hackernoon я смог создать очень простую библиотеку компонентов React для кнопки Войти с помощью Blockstack. Результат этой библиотеки - изображение выше, и вы можете найти репо на Github.
Я хотел дать разработчику полный контроль. Они должны иметь возможность настраивать все, в то время как реализация занимает секунды. Есть два компонента SignInBlockstackButton
и SignInBlockstackLiteButton
. Для SignInBlockstackButton
требуется одна опора - isSignedIn
. Это проверено библиотекой blockstack.js
, и я планирую интегрировать, поэтому никаких дополнительных свойств не требуется. Разница между ними в том, что SignInBlockstackButton
функции входа и выхода включены и предварительно написаны, а SignInBlockstackLiteButton
передает их как реквизиты. Я не буду рассматривать все варианты опоры, но включу их ниже:
<SignInBlockstackButton isSignedIn={this.state.isLoggedIn} signInBtnText="Custom Sign In Text" signOutBtnText="Custom Sign Out Text" includeBlockstackLogo={false} signOutRedirect="/custom-signout-page" renderNothing={false} textStyle={{ fontSize: 24, }} imageStyle={{ height: 100, }} signOutStyle={{ backgroundColor: 'red', }} signInStyle={{ backgroundColor: 'green', }} style={{ backgroundColor: '#fff', }} defaultStyle={{}} />
Все реквизиты описаны в README.
Заключение
Определенно еще один отличный способ учиться, и я надеюсь, что люди воспользуются этим проектом.